Как обновить объект параметров в функции beforeSubmit с помощью плагина jQuery Forms - PullRequest
Новая
       8

Как обновить объект параметров в функции beforeSubmit с помощью плагина jQuery Forms

4 голосов
/ 08 июля 2010

Я реорганизую использование $.ajax для отправки форм с помощью плагина jQuery Forms. API утверждает, что можно передать любой из параметров, переданных в $.ajax, в $.ajaxSubmit.Я хочу изменить объект параметров в beforeSubmit, добавив свойство data.Предупреждение о значении options.beforeSubmit в processSubmit предполагает, что это объект параметров, инициализированный обработчиком, и что данные установлены, но, поскольку объект параметров уже был инициализирован без свойства data, он не включенв посте, отправленном на сервер.Можно ли изменить объект параметров в beforeSubmit или каким-либо другим способом?

Когда документ будет готов, я привязываю обработчик к 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>

1 Ответ

3 голосов
/ 08 июля 2010

Вместо beforeSubmit следует использовать параметр beforeSerialize , чтобы ваши данные включались при сериализации. Вы не устанавливаете .data для опций, переданных в $.ajax(), вы устанавливаете .data для опций $.ajaxSubmit(), что является свойством для плагина дополнительных данных, включаемых при сериализации. Когда 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() и > дочерний селектор здесь, чтобы упростить получение вашего массива, но ваш оригинальный метод работает ... просто обратите внимание важное отличие в том, что параметры обратного вызова отличаются от beforeSubmit, для обратного вызова beforeSerialize нет параметра arr.

...