Summary of jquery+ajax submission form method
Apr 25, 2018 pm 03:07 PMThis time I will bring you a summary of the jquery ajax form submission method. What are the precautions for jquery ajax submission of the form. The following is a practical case, let's take a look.
Summary of two methods of jquery's ajax submission form (recommended)
Method one:
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); } }); }
Method two:
//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); } }); } );
Page html code:
<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> </td> </tr> <tr> <td> </td> <td> <input id="Submit1" type="submit" value="添加处理费" /> <asp:Button ID="Button1" runat="server" Text="添加处理费" OnClientClick="javascript:AddHandlingFeeToRefund()" /> </td> </tr> </table> </form>
I believe you have mastered the method after reading the case in this article. For more exciting information, please pay attention to other related articles on the php Chinese website!
Recommended reading:
Detailed explanation of Ajax user authentication and registration
How to implement the partial refresh function with jQuery and ajax
The above is the detailed content of Summary of jquery+ajax submission form method. For more information, please follow other related articles on the PHP Chinese website!

Hot Article

Hot tools Tags

Hot Article

Hot Article Tags

Notepad++7.3.1
Easy-to-use and free code editor

SublimeText3 Chinese version
Chinese version, very easy to use

Zend Studio 13.0.1
Powerful PHP integrated development environment

Dreamweaver CS6
Visual web development tools

SublimeText3 Mac version
God-level code editing software (SublimeText3)

Hot Topics

How to write a novel in the Tomato Free Novel app. Share the tutorial on how to write a novel in Tomato Novel.

How to delete WeChat friends? How to delete WeChat friends

How to enter bios on Colorful motherboard? Teach you two methods

How to recover deleted contacts on WeChat (simple tutorial tells you how to recover deleted contacts)

Summary of methods to obtain administrator rights in Win11

Quickly master: How to open two WeChat accounts on Huawei mobile phones revealed!

Detailed explanation of Oracle version query method

The secret of hatching mobile dragon eggs is revealed (step by step to teach you how to successfully hatch mobile dragon eggs)
