分别获取所需数据元素,dom结构外层不用包form标签(适用于数据量少,数据元素分散于整个页面)
$.ajax({ type: 'post', url:'', data: { residence:[$('#region_1').val(),$('#region_2').val(),$('#region_3').val()], address:$('#address').val() }, datatype: 'json', success: function(data){ }, error:function(err){ } });
方法二:
需要包裹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); } }); }
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></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>
以上就是jquery实现ajax提交表单的两种方法的详细内容。