我正在重构我对 $.ajax
的使用,以使用 jQuery 表单插件提交表单。 API指出可以将传递给 $.ajax
的任何选项传递给 $.ajaxSubmit
。我希望修改 beforeSubmit
中的选项对象,添加 data
属性。提醒 processSubmit
中 options.beforeSubmit
的值表明这是由处理程序初始化的选项对象并且数据已设置,但由于选项对象已经初始化如果没有 data
属性,它不会包含在发送到服务器的帖子中。是否可以在 beforeSubmit
中或以其他方式修改选项对象?
文档准备好后,我将处理程序绑定(bind)到 submit()
:
$("#myform").submit(function() {
var options = { dataType: 'json',
beforeSubmit: processSubmit,
success: endSubmit };
$(this).ajaxSubmit(options);
return false;
});
processSubmit(arr, $form, options)
函数将要发送到服务器的数据打包为 JSON:
function processSubmit(arr, $form, options) {
var followers =[];
$($("#follower-multi-select").children().filter("li")).each(function() {
if ($(this).hasClass("selected")) {
var fwr = $(this).attr("id");
followers.push(fwr);
}
});
var postData = { followers : followers };
alert('beforeSubmit is: ' + options.beforeSubmit);
options.data = 'json='+$.toJSON(postData);
alert('data set: ' + options.data);
}
表单 HTML:
<form id="myform" action="/myaction" method="post">
<fieldset>
<legend>Choose your competitors</legend>
<ul id="follower-multi-select" class="follower-multi-select">
{% for f in follower_thumbs %}
<li id="{{ f.hashedkey }}"><img src='{{ f.thumb }}' alt="{{ f.name }}" /><span class="name-multi-select">{{ f.name }}</span></li>
{% endfor %}
</ul>
</fieldset>
<input id="send" type="submit" class="large" value="send" />
</form>
最佳答案
而不是 beforeSubmit
你应该使用the beforeSerialize
option ,因此您的数据在序列化时会被包含在内。您没有设置 .data
关于传递给 $.ajax()
的选项,您正在设置 .data
关于$.ajaxSubmit()
options,这是序列化时要包含的额外数据插件的属性。当beforeSubmit
发生这种情况时,序列化已经已经完成,您需要在此之前介入,如下所示:
$("#myform").submit(function() {
var options = { dataType: 'json',
beforeSerialize: processSubmit,
success: endSubmit };
$(this).ajaxSubmit(options);
return false;
});
function processSubmit($form, options) {
var followers = $("#follower-multi-select > li.selected").map(function() {
return this.id;
}).get();
var postData = { followers : followers };
alert('beforeSubmit is: ' + options.beforeSubmit);
options.data = 'json='+$.toJSON(postData);
alert('data set: ' + options.data);
}
我还用过 .map()
和 >
child-selector这里是为了让你的数组的获取变得更简单,但是你原来的方法是有效的......只需注意回调中的参数与 beforeSubmit
不同的重要区别。 ,没有arr
beforeSerialize
的参数回调。
关于jquery - 如何使用 jQuery 表单插件更新 beforeSubmit 函数中的选项对象,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/3202527/