我认为这很简单,但是正如标题所示,在任何地方都找不到如何执行此操作的方法,就像成功提交表单后如何处理ajax一样。我尝试搜索它,但所看到的只是我需要的相反内容,即在ajax发布后提交。我将尝试草拟与Im正在研究的程序非常相似的程序。 这是我的表格。
<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> }
这是一个有关ajax帖子的示例(不要介意该帖子的逻辑):
$.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)); }); }});
现在,我想做的就是提交表单时,如果提交成功,就会触发ajax发布。因此,就像在一个按钮中发布2次一样,不同之处在于另一个是表单提交,而另一个是ajax发布。PLS帮助。
您应该做的是使用jQuery“接管提交按钮”,然后在内部使用ajax调用。
例如,具有此提交按钮:
<input type="submit" value="Submit" onsubmit="$('#your-form-id-here').submit()">
并通过ajax调用使用jQuery Submit函数,应该给您一个很好的主意。
$('#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); } }); });
这基本上采用您的正常形式,并通过您的Ajax调用将其发送到您的正常形式动作,因此基本上它的工作原理与正常一样,但是您现在有机会在您的形式动作php文件以及您的Ajax中进行操作成功数据。例如,您可以使用它直接将验证消息传递给您的用户,而无需刷新您的网站。等等…