javascript - How to Ajax POST after a Form Submit -
i think pretty simple cannot find anywhere how this, title says, how do ajax post after successful submit form post. tried search see reverse of need submit after ajax post. i'll try make draft of program similar im working on.
form.
<h2>my form </h2> @using (html.beginform(new { @class = "submitform" })) { <label>loan amount</label> @html.dropdownlistfor(model => model.loan.loanamount, model.dropdownofloanamount, new { @class = "loanamount", @data_bind = "value: selectedloanamount" }) @html.validationmessagefor(model => model.loan.loanamount) <label>loan receivable</label> @html.textboxfor(model => model.loan.loanreceivable, "{0:0,0.00}", new { @class = "loanreceivable", @readonly = true, dir = "rtl", @data_bind = "value: loanreceivable" }) @html.validationmessagefor(model => model.loan.loanreceivable) <label>interest</label> @html.textboxfor(model => model.loan.interest, "{0:0,0.00}", new { @readonly = true, @class = "interest", dir = "rtl", @data_bind = "value: interest" }) <table class="input-group"> <tbody data-bind="foreach: loandeductions"> <tr> <td><strong data-bind='text: deductionname'></strong></td> <td> <input class="deductioncode form-control" data-bind='value: amount, valueupdate: "afterkeydown"' /></td> <td><a href='#' data-bind='click: $parent.removeline'>delete</a></td> </tr> </tbody> </table> <button type="button" class="btn btn-danger">save deduction</button> <button type="submit" class="btn btn-primary">save changes</button> }
this example ajax post (dont mind logic of post):
$.ajax({ 'url' :'@url.action("updatedeductionvalues","loanapp")', 'data': {amount : $('.loanamount').val()}, 'success': function(result) { $.each(result, function (idx, items) { $('.' + items.code + '').val(items.amount.tofixed(2)); }); }});
now want happen when submit form, if submit successful, ajax post triggered. posting 2 times in 1 button, difference other 1 form submit while other ajax post. pls help.
what should "take on submit button" jquery, , use ajax call inside.
for example having submit button:
<input type="submit" value="submit" onsubmit="$('#your-form-id-here').submit()">
and having jquery submit function ajax call, should give pretty idea on do.
$('#your-form-id-here').submit(function (e) { e.preventdefault(); var senddata = $(this).serializearray(); var sendto = $(this).attr("action"); $.ajax({ url: sendto, type: 'post', data: senddata, success: function (data) { $('.messages').html(data); }, error: function (error) { $('.messages').html(error); } }); });
this takes normal form, , send through ajax call, normal form action, works normal, have opportunity stuff in form action php file, , in ajax success data. example use deliver validation messages directly user, without refreshing site. , on...
Comments
Post a Comment