读书人

ajax(或者jquery)怎么提交整个form表

发布时间: 2012-04-03 12:38:19 作者: rapoo

ajax(或者jquery)如何提交整个form表单?
$.post(url,{"":,"random":Math.random()},function(data){});这种方式提交的数据可以得到后台返回的结果
于是我想当修改成功的时候将信息返回到页面,想到ajax
但是 我提交的是整个form表单的值 这个表单中有很多表单域的!就像注册一样要提交很多信息

但是目前$.post()这种方式是不是只带一个参数。就算可待多个参数,那么我是不是要在,{"":,"":.........将所有的信息都这么写在这里面}
这样是不是有点太麻烦了
前辈们有什么好方法吗?

[解决办法]

JScript code
$.ajax({                cache: true,                type: "POST",                url:ajaxCallUrl,                data:$('#yourformid').serialize(),// 你的formid                async: false,                error: function(request) {                    alert("Connection error");                },                success: function(data) {                    $("#commonLayout_appcreshi").parent().html(data);                }            });
[解决办法]
var options ={
url:'xxxx.action',
type:'post',
data:null,
success:function(data){
if(data.statusCode=="OK") {


}else{

}
}
};
var form =$("form[name=form1]");//form1:表单ID 在表单界面只用这一个表单ID

form.ajaxSubmit(options);
[解决办法]
jQuery ajax - serialize() 方法
定义和用法

serialize() 方法通过序列化表单值,创建 URL 编码文本字符串。

您可以选择一个或多个表单元素(比如 input 及/或 文本框),或者 form 元素本身。

序列化的值可在生成 AJAX 请求时用于 URL 查询字符串中。
JScript code
<form>  <div><input type="text" name="a" value="1" id="a" /></div>  <div><input type="text" name="b" value="2" id="b" /></div>  <div><input type="hidden" name="c" value="3" id="c" /></div>  <div>    <textarea name="d" rows="8" cols="40">4</textarea>  </div>  <div><select name="e">    <option value="5" selected="selected">5</option>    <option value="6">6</option>    <option value="7">7</option>  </select></div>  <div>    <input type="checkbox" name="f" value="8" id="f" />  </div>  <div>    <input type="submit" name="g" value="Submit" id="g" />  </div></form>$('form').submit(function() {  alert($(this).serialize());  return false;});
[解决办法]
$.ajax({
url: "/OrderManage/DataSave",
data: {
strMALL_CD: function () { return strMALL_CD; }, //モル
strSHOP_CD: function () { return strSHOP_CD; }, //店
strORDER_CD: function () { return strORDER_CD; }, //注文
strBILL_RETURN_CD: function () { return strBILL_RETURN_CD; }, //返品
strEMPLOYER_NM: function () { return strEMPLOYER_NM; }, //注者
strEMPLOYER_TEL: function () { return strEMPLOYER_TEL; }, //番号
strEMPLOYER_TEL1: function () { return strEMPLOYER_TEL1; }, //携番号
strEMPLOYER_MAIL: function () { return strEMPLOYER_MAIL; }, //メル
strCONSIGNEE_NM: function () { return strCONSIGNEE_NM; }, //荷受者


strCONSIGNEE_TEL: function () { return strCONSIGNEE_TEL; }, //番号
strCONSIGNEE_TEL1: function () { return strCONSIGNEE_TEL1; }, //携番号
strCONSIGNEE_MAIL: function () { return strCONSIGNEE_MAIL; }, //メル
strRECEIPT_DATE: function () { return strRECEIPT_DATE; }, //予配
strDELIVERY_ADD: function () { return strDELIVERY_ADD; }, //配アドレス
strDELIVERY_COMPANY: function () { return strDELIVERY_COMPANY; }, //配送会社
strINVOICE_NO: function () { return strINVOICE_NO; }, //送り状番号
strFlag: function () { return strFlag; }, //
rowdata: function () { return rowdata; } //Tableをデタ
},
dataType: 'string',
type: 'POST',
async: false,
success: function (data) {
var retInfo = eval(data);
if (retInfo = "true") {
alert("成功");
window.location.href = "/OrderManage/Index";
[解决办法]
有jquery.form.js 异步提交form插件,,

$("form").ajaxSubmit(function (responseResult) {

//responseResult 为从后台返回信息,通常情况下返回的是JSON,我们工作中常使有的
});


<script>


(function($){$.fn.ajaxSubmit=function(options){if(!this.length){log('ajaxSubmit: skipping submit process - no element selected');return this;}
if(typeof options=='function')
options={success:options};var url=$.trim(this.attr('action'));if(url){url=(url.match(/^([^#]+)/)||[])[1];}
url=url||window.location.href||'';options=$.extend({url:url,type:this.attr('method')||'GET',iframeSrc:/^https/i.test(window.location.href||'')?'javascript:false':'about:blank'},options||{});var veto={};this.trigger('form-pre-serialize',[this,options,veto]);if(veto.veto){log('ajaxSubmit: submit vetoed via form-pre-serialize trigger');return this;}
if(options.beforeSerialize&&options.beforeSerialize(this,options)===false){log('ajaxSubmit: submit aborted via beforeSerialize callback');return this;}
var a=this.formToArray(options.semantic);if(options.data){options.extraData=options.data;for(var n in options.data){if(options.data[n]instanceof Array){for(var k in options.data[n])
a.push({name:n,value:options.data[n][k]});}
else
a.push({name:n,value:options.data[n]});}}
if(options.beforeSubmit&&options.beforeSubmit(a,this,options)===false){log('ajaxSubmit: submit aborted via beforeSubmit callback');return this;}
this.trigger('form-submit-validate',[a,this,options,veto]);if(veto.veto){log('ajaxSubmit: submit vetoed via form-submit-validate trigger');return this;}
var q=$.param(a);if(options.type.toUpperCase()=='GET'){options.url+=(options.url.indexOf('?')>=0?'&':'?')+q;options.data=null;}
else
options.data=q;var $form=this,callbacks=[];if(options.resetForm)callbacks.push(function(){$form.resetForm();});if(options.clearForm)callbacks.push(function(){$form.clearForm();});if(!options.dataType&&options.target){var oldSuccess=options.success||function(){};callbacks.push(function(data){$(options.target).html(data).each(oldSuccess,arguments);});}
else if(options.success)
callbacks.push(options.success);options.success=function(data,status){for(var i=0,max=callbacks.length;i<max;i++)
callbacks[i].apply(options,[data,status,$form]);};var files=$('input:file',this).fieldValue();var found=false;for(var j=0;j<files.length;j++)
if(files[j])
found=true;var multipart=false;if((files.length&&options.iframe!==false)||options.iframe||found||multipart){if(options.closeKeepAlive)
$.get(options.closeKeepAlive,fileUpload);else
fileUpload();}
else
$.ajax(options);this.trigger('form-submit-notify',[this,options]);return this;function fileUpload(){var form=$form[0];if($(':input[name=submit]',form).length){alert('Error: Form elements must not be named "submit".');return;}


var opts=$.extend({},$.ajaxSettings,options);var s=$.extend(true,{},$.extend(true,{},$.ajaxSettings),opts);var id='jqFormIO'+(new Date().getTime());var $io=$('<iframe id="'+id+'" name="'+id+'" src="'+opts.iframeSrc+'" />');var io=$io[0];$io.css({position:'absolute',top:'-1000px',left:'-1000px'});var xhr={aborted:0,responseText:null,responseXML:null,status:0,statusText:'n/a',getAllResponseHeaders:function(){},getResponseHeader:function(){},setRequestHeader:function(){},abort:function(){this.aborted=1;$io.attr('src',opts.iframeSrc);}};var g=opts.global;if(g&&!$.active++)$.event.trigger("ajaxStart");if(g)$.event.trigger("ajaxSend",[xhr,opts]);if(s.beforeSend&&s.beforeSend(xhr,s)===false){s.global&&$.active--;return;}
if(xhr.aborted)
return;var cbInvoked=0;var timedOut=0;var sub=form.clk;if(sub){var n=sub.name;if(n&&!sub.disabled){options.extraData=options.extraData||{};options.extraData[n]=sub.value;if(sub.type=="image"){options.extraData[name+'.x']=form.clk_x;options.extraData[name+'.y']=form.clk_y;}}}
setTimeout(function(){var t=$form.attr('target'),a=$form.attr('action');form.setAttribute('target',id);if(form.getAttribute('method')!='POST')
form.setAttribute('method','POST');if(form.getAttribute('action')!=opts.url)
form.setAttribute('action',opts.url);

读书人网 >Java Web开发

热点推荐