Html.BeginForm как избежать многократной отправки формы?

У нас есть следующий код для регистрации страницы

@using (Html.BeginForm(MVC.Account.Register(Model.ReturnUrl), FormMethod.Post, new { @id = "register-form" }))
{
    <div class="control-group clear">
        @Html.LabelFor(m => m.Email)
        @Html.TextBoxFor(m => m.Email, new { type = "email", @class = "forbid-lt-gt" })
        <span class="hint raise">Will be user as Username.</span>
        <div class="error">@Html.ValidationMessageFor(m => m.Email)</div>
    </div>
    <div class="control-group clear">
        @Html.LabelFor(m => m.Password)
        @Html.PasswordFor(m => m.Password)
        <span class="hint raise">Length between 6 and 10 characters</span>
        <div class="error">@Html.ValidationMessageFor(m => m.Password)</div>
    </div>
    <div class="control-group clear">
        @Html.LabelFor(m => m.ConfirmPassword)
        @Html.PasswordFor(m => m.ConfirmPassword)
        <div class="error">@Html.ValidationMessageFor(m => m.ConfirmPassword)</div>
    </div>

    <div class="control-group action">
        <button class="btn primary" type="submit">
            <span>Sign up</span>
        </button>
    </div>
    <div class="clear"></div>
}

И файл formBlocker.js для предотвращения многократного нажатия кнопки

$(function() {
    $('form').one('submit', function () {
        $(this).find('button[type="submit"]').attr('disabled', 'disabled');
    });

    //Enable submit button if data has changed
    $('form').live("input", function () {
        $(this).find('button[type="submit"]').removeAttr('disabled');
    });
});

Обычно все в порядке, но иногда это не работает, и после того, как пользователь несколько раз нажал на кнопку, форму можно отправить несколько раз на сервер. Ранее у нас была проблема с тем, что после нажатия кнопки "Отправить" в форме IE дважды отправлялся на сервер. Теперь у нас нет этой проблемы, но она не была исправлена.

2 ответа

Попробуйте это Не уверен, но это работает для меня

$('form').one('submit', function () {
        $(this).find('button[type="submit"]').attr('disabled', 'disabled');
        setTimeout(function () {
              $(this).find('button[type="submit"]').attr('disabled', 'disabled');
         }, 20);
    });

live мертв. мертвых. Это устарело в 2.7 и удалено в 2.9. МЕРТВЫХ!

Я бы использовал этот подход:

var serializedData;

$(function () {
    $('form').submit(function () {
        var tempSerializedData = $(this).serialize();
        if (tempSerializedData != serializedData) 
            serializedData = tempSerializedData;
        else 
            return false;

    });
});
Другие вопросы по тегам