Javascript 带有序列化和额外数据的 jQuery post()
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/6627936/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
jQuery post() with serialize and extra data
提问by Vitaliy Isikov
I'm trying to find out if it's possible to post serialize()
and other data that's outside the form.
我试图找出是否可以发布serialize()
表单之外的其他数据。
Here's what I thought would work, but it only sends 'wordlist'
and not the form data.
这是我认为可行的方法,但它只发送'wordlist'
而不是表单数据。
$.post("page.php",( $('#myForm').serialize(), { 'wordlist': wordlist }));
Does anyone have any ideas?
有没有人有任何想法?
回答by Felix Kling
You can use serializeArray
[docs]and add the additional data:
您可以使用serializeArray
[docs]并添加其他数据:
var data = $('#myForm').serializeArray();
data.push({name: 'wordlist', value: wordlist});
$.post("page.php", data);
回答by Michael Mior
回答by r3wt
An alternative solution, in case you are needing to do this on an ajax file upload:
另一种解决方案,以防您需要在 ajax 文件上传时执行此操作:
var data = new FormData( $('#form')[0] ).append( 'name' , value );
OR even simpler.
或者更简单。
$('form').on('submit',function(e){
e.preventDefault();
var data = new FormData( this ).append('name', value );
// ... your ajax code here ...
return false;
});
回答by Gudradain
When you want to add a javascript object to the form data, you can use the following code
当你想在表单数据中添加一个javascript对象时,可以使用下面的代码
var data = {name1: 'value1', name2: 'value2'};
var postData = $('#my-form').serializeArray();
for (var key in data) {
if (data.hasOwnProperty(key)) {
postData.push({name:key, value:data[key]});
}
}
$.post(url, postData, function(){});
Or if you add the method serializeObject(), you can do the following
或者,如果您添加方法serializeObject(),您可以执行以下操作
var data = {name1: 'value1', name2: 'value2'};
var postData = $('#my-form').serializeObject();
$.extend(postData, data);
$.post(url, postData, function(){});
回答by Eric Wang
In new version of jquery, could done it via following steps:
在新版本的 jquery 中,可以通过以下步骤完成:
- get param array via
serializeArray()
- call
push()
or similar methods to add additional params to the array, - call
$.param(arr)
to get serialized string, which could be used as jquery ajax'sdata
param.
- 通过获取参数数组
serializeArray()
- 调用
push()
或类似的方法向数组添加额外的参数, - 调用
$.param(arr)
获取序列化字符串,可以用作jquery ajax 的data
参数。
Example code:
示例代码:
var paramArr = $("#loginForm").serializeArray();
paramArr.push( {name:'size', value:7} );
$.post("rest/account/login", $.param(paramArr), function(result) {
// ...
}
回答by Ganesan Murugesan
$.ajax({
type: 'POST',
url: 'test.php',
data:$("#Test-form").serialize(),
dataType:'json',
beforeSend:function(xhr, settings){
settings.data += '&moreinfo=MoreData';
},
success:function(data){
// json response
},
error: function(data) {
// if error occured
}
});
回答by Darin Dimitrov
You could have the form contain the additional data as hidden fields which you would set right before sending the AJAX request to the corresponding values.
您可以让表单包含附加数据作为隐藏字段,您可以在将 AJAX 请求发送到相应值之前设置这些数据。
Another possibility consists into using this little gemto serialize your form into a javascript object (instead of string) and add the missing data:
另一种可能性是使用这个小 gem将您的表单序列化为 javascript 对象(而不是字符串)并添加丢失的数据:
var data = $('#myForm').serializeObject();
// now add some additional stuff
data['wordlist'] = wordlist;
$.post('/page.php', data);
回答by Marouane B.
You can use this
你可以用这个
var data = $("#myForm").serialize();
data += '&moreinfo='+JSON.stringify(wordlist);
回答by A A Karim
I like to keep objects as objects and not do any crazy type-shifting. Here's my way
我喜欢将对象保留为对象,而不是进行任何疯狂的类型转换。这是我的方式
var post_vars = $('#my-form').serializeArray();
$.ajax({
url: '//site.com/script.php',
method: 'POST',
data: post_vars,
complete: function() {
$.ajax({
url: '//site.com/script2.php',
method: 'POST',
data: post_vars.concat({
name: 'EXTRA_VAR',
value: 'WOW THIS WORKS!'
})
});
}
});
if you can't see from above I used the .concat function and passed in an object with the post variable as 'name' and the value as 'value'!
如果从上面看不到,我使用了 .concat 函数并传入了一个对象,其中 post 变量为“名称”,值为“值”!
Hope this helps.
希望这可以帮助。