您的位置:首页 > 其它

ajax提交表单方式

2016-03-02 17:06 218 查看
用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         //设置请求时间,超过该时间后,自动退出请求,单位(毫秒)。      

     }
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: