Ненавязчивая проверка jQuery игнорирует класс «отмена» на кнопке отправки, если используется в форме Ajax

Я пытаюсь реализовать дополнительную проверку на стороне клиента с помощью

ASP.NET MVC 4, unobtrusive jQuery validation, unobtrusive ajax This works fine

Следующие рисунки показывают, что я имею в виду с дополнительной проверкой на стороне клиента: Ожидается, что единственное поле в моей форме будет содержать электронную почту, поэтому к нему прикреплен валидатор электронной почты.

enter image description here

Теперь мы нажимаем на сохранить. Потому что наш текст"name@doamin" недействительный адрес электронной почты, на котором отображается сводка проверки. Вместе с проверкой итогов мы показываем"Save anyway" кнопка.

enter image description here

Эта вторая кнопка является обычной кнопкой отправки, просто имеяclass="cancel", Это инструктируетjQuery.validate.js скрипт для пропуска проверки при отправке с помощью этой кнопки.

Вот фрагмент кода представления:

@using (Html.BeginForm())
{
    <div>
        <input data-val="true" data-val-email="Uups!" name="emailfield" />
        <span class="field-validation-valid" data-valmsg-for="emailfield" data-valmsg-replace="false">*</span>
    </div>

    <input type="submit" value="Save" />
    @Html.ValidationSummary(false, "Still errors:")
    <div class="validation-summary-valid" data-valmsg-summary="true">
        <input type="submit" value="Save anyway" class="cancel" />
    </div>
}

Все это прекрасно работает.

The problem

Вторая кнопка отправки -"Save anyway" перестает работать, как ожидалось, если я переключаюсь на форму Ajax. Он просто ведет себя как нормальный и запрещает отправку, пока проверка не пройдет успешно.

Вот фрагмент кода "ajaxified" Посмотреть:

@using (Ajax.BeginForm("Edit", new { id = "0" },
        new AjaxOptions
            {
                HttpMethod = "POST",
                InsertionMode = InsertionMode.Replace,
                UpdateTargetId = "ajaxSection",
            }))
{
    <div>
        <input data-val="true" data-val-email="Uups!" name="emailfield" />
        <span class="field-validation-valid" data-valmsg-for="emailfield" data-valmsg-replace="false">*</span>
    </div>

    <input type="submit" value="Save" />
    @Html.ValidationSummary(false, "Still errors:")
    <div class="validation-summary-valid" data-valmsg-summary="true">
        <input type="submit" value="Save anyway" class="cancel" name="saveAnyway" />
    </div>
}

Я отладилjQuery.validation.js выяснить в чем разница, но не получилось.

Qustion

Любые идеи, чтобы исправить или обойти проблему и позволить форме ajax вести себя, как задумано, приветствуются.

Addendum

Иметьclient side validation абсолютно необходимо. Проверка на стороне сервера не вариант. Помимо более высокого трафика (этот пример является упрощением - реальная форма содержит гораздо больше полей) и задержкой, есть одна вещь, которую проверка на стороне сервера не будет делать: средства проверки на стороне клиента выделяют ошибочные поля при потере фокуса. Это означает, что у вас есть отзыв, как только вы перейдете к следующему полю.

Ответы на вопрос(3)

Ваш ответ на вопрос