您现在的位置: 万盛学电脑网 >> 程序编程 >> 脚本专题 >> javascript >> 正文

jquery实现ajax提交form表单的方法总结

作者:佚名    责任编辑:admin    更新时间:2022-06-22

 本篇文章主要是对jquery实现ajax提交form表单的方法进行了总结介绍,需要的朋友可以过来参考下,希望对大家有所帮助

方法一:     代码如下: function AddHandlingFeeToRefund()           {             var AjaxURL= "../OrderManagement/AjaxModifyOrderService.aspx";                    alert($('#formAddHandlingFee').serialize());                 $.ajax({                     type: "POST",                     dataType: "html",                     url: AjaxURL + '?Action=' + 'SubmitHandlingFee' + '&OrderNumber=' + $.trim($("#<%=this.txtOrderNumber.ClientID %>").val()),                     data: $('#formAddHandlingFee').serialize(),                     success: function (result) {                         var strresult=result;                         alert(strresult);                         //加载最大可退金额                         $("#spanMaxAmount").html(strresult);                     },                     error: function(data) {                         alert("error:"+data.responseText);                      }                   });           }     方法二: 代码如下:         //ajax提交form表单的方式         $('#formAddHandlingFee').submit(function() {             var AjaxURL= "../OrderManagement/AjaxModifyOrderService.aspx";                    alert($('#formAddHandlingFee').serialize());                 $.ajax({                     type: "POST",                     dataType: "html",                     url: AjaxURL + '?Action=' + 'SubmitHandlingFee' + '&OrderNumber=' + $.trim($("#<%=this.txtOrderNumber.ClientID %>").val()),                     data: $('#formAddHandlingFee').serialize(),                     success: function (data) {                         var strresult=data;                         alert(strresult);                         //加载最大可退金额                         $("#spanMaxAmount").html(strresult);                     },                     error: function(data) {                         alert("error:"+data.responseText);                      }                   });         }       );     页面html代码:  代码如下:                   <form id="formAddHandlingFee" name="formAddHandlingFee" enctype="multipart/form-data" onsubmit="AddHandlingFeeToRefund()">                     <table id="AddHandlingFee" class="Wfill">                         <tr>                             <td>                                 <asp:Literal ID="UI_Amount" runat="server" Text="处理费用" meta:resourcekey="HandlingFeeAmount" />                             </td>                             <td>                                 <input type="text" id="txtHandlingFeeAmount" name="txtHandlingFeeAmount"  class="{required:true,number:true}" maxlength="12" />                             </td>                         </tr>                         <tr>                             <td>                                 <asp:Literal ID="UI_HandlingFeeType" runat="server" Text="费用类型" meta:resourcekey="HandlingFeeHandlingFeeType" />                             </td>                             <td>                                 <crmweb:HtmlSelectControl ID="HandlingFeeType" EnumTypeName="DX.OMS.Model.Common.HandlingFeeType,DX.OMS.Model.Common" EmptyValue="" EmptyText="Select" runat="server" class="text {required:true}"/>                             </td>                         </tr>                         <tr>                             <td>                                 <asp:Literal ID="UI_Notes" runat="server" Text="备注" meta:resourcekey="HandlingFeeNotes" />                             </td>                             <td>                                 <textarea id="txtNotes" name="txtNotes" class="text {required:true}" cols="22" rows="2" maxlength="100"></textarea