萬盛學電腦網

 萬盛學電腦網 >> 腳本專題 >> javascript >> jquery實現ajax提交form表單的方法總結

jquery實現ajax提交form表單的方法總結

 本篇文章主要是對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
copyright © 萬盛學電腦網 all rights reserved