ajax提交表单方式

用ajax提交表单遇到的问题，虽然有点久远了；但是今天他们遇到了就记录一下。

先说用ajax提交表单

方式一：ajax提交把formAddHandlingFee序列化参数然后提交，获取回传结果，做后续操作

function AddHandlingFeetorefund()
        {
            var AjaxURL= "../OrderManagement/AjaxModifyOrderService.aspx";
                $.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("提交失败");
                    },error: function(data) {
                        alert("提交失败");
                     }
                });
        }

方式二：用 jQuery.Form.js 插件的作用是实现Ajax提交表单。需要注意的是ajaxSubmit()不会自动阻止表单提交，想阻止表单提交，要自己return false;

$("#form1".submit)(function(){
　 $("#form1").ajaxSubmit();
　　　return false;
　　})

方式三：用ajaxform或者ajaxsubmit

$("#MailForm").ajaxSubmit(function(message) {
　　　　alert("表单提交已成功!");
　　});

<pre name="code" class="javascript">$("#goodsForm").ajaxForm(function(mes){
			if(mes == "true"){
				alert("提交成功");
				window.close();
			}else{
				alert("提交失败");
			}
		});

注意:ajaxsubmit()与ajaxForm()都可以没有参数或者接受1个参数。该参数既可以是一个回调函数，也可以是一个options对象。该对象功能非常强大，说明如下:

　　　　　var options={

　　　　　　 url:url,　　　　　　//form提交数据的地址

　　　　　　 type:type,　　　 //form提交的方式(method:post/get)

　　　　　　 target:target,　　//服务器返回的响应数据显示在元素(Id)号确定

　　　　　　 beforeSubmit:function(),　　//提交前执行的回调函数

　　　　　　 success:function(),　　　　 //提交成功后执行的回调函数

　　　　　　 dataType:null,　　　　　　　//服务器返回数据类型

　　　　　　 clearForm:true,　　　　　　 //提交成功后是否清空表单中的字段值

　　　　　　 restForm:true,　　　　　　 //提交成功后是否重置表单中的字段值，即恢复到页面加载时的状态

　　　　　　 timeout:6000　　　　　　 //设置请求时间，超过该时间后，自动退出请求，单位(毫秒)。　　　　　　

　　　　　｝

原文地址：https://www.jb51.cc/ajax/162407.html

相关推荐