如何使用 jQuery Forms 插件更新 beforeSubmit 函数中的选项对象

meg*_*meg 5 jquery jquery-forms-plugin

我正在重构我使用$.ajaxjQuery 表单插件提交表单的用法。该API的状态,有可能通过任何传递给选项$.ajax$.ajaxSubmit。我希望修改 中的选项对象beforeSubmit,添加一个data属性。警告options.beforeSubmitin的值processSubmit表明这是由处理程序初始化的选项对象,并且数据已设置,但由于选项对象已经在没有data属性的情况下进行了初始化,因此它不包含在发送到服务器的帖子中。是否可以在 中beforeSubmit或以其他方式修改选项对象?

当文档准备好时,我将一个处理程序绑定到submit()

$("#myform").submit(function() {
    var options = { dataType: 'json',
            beforeSubmit: processSubmit,
            success: endSubmit };
    $(this).ajaxSubmit(options);
    return false;
});
Run Code Online (Sandbox Code Playgroud)

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);
}
Run Code Online (Sandbox Code Playgroud)

表单 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>
Run Code Online (Sandbox Code Playgroud)