Блог

Форма содержит элемент ввода. Введенное значение проверяется с помощью обратного вызова сервера из события размытия andler.

Если введено неправильное значение и нажата кнопка отправки, форма отправляется с неправильным значением: метод проверки не завершен, но выполняется метод действия отправки формы.

Как принудительно выполнить метод Validate() перед выполнением метода отправки формы?

jquery, jQueryUI, ASP .Используются NET MVC2.

 <form id="Form" class='form-fields' method='post'   action='/Report/Render'>
  <input id='test' name='test' value='test' />
  <input id='_submit' type='submit' value='Show report' />
</form>

    $('#test').bind({
        blur: function (e) {
            if (!Validate(e.target)) {
                cancel(e);
            }
        }
    });
  

Обновить

Как требуется в комментарии BobTodd, здесь приведен метод проверки:

 function Validate(elem) {
var i,
  res;
$.ajax('Grid/Validate' );
   {
       data: $("#Form").serializeArray(),
       //async: false,
       type: 'POST',
       error: function (jqXHR, textStatus, errorThrown) {
           elem.skipBlur = true;
           errorMessage(decodeErrorMessage(jqXHR.responseText === undefined ? '' : jqXHR.responseText,
                      textStatus, errorThrown));
           elem.focus();
           elem.select();
           elem.skipBlur = false;
           elem.ischanged = true;
           res = false;
       },
       success: function (data) {
           elem.ischanged = false;
           for (i = 0; i < data.length; i  = 1) {
               $('#'   data[i].name).val(data[i].value);
           }
           res = true;
       }
   });
return false; //  res;
  

}

Update2

Во всех ответах предлагается запретить запуск метода отправки, если проверка не выполнена. Это обеспечивает очень плохой пользовательский интерфейс: проверка занимает некоторое время. Пользователь должен нажать два раза на кнопку отправки, чтобы отправить форму. Как разрешить отправку формы одним щелчком мыши? Метод синхронизации Maksing Validate () использует это, но я не уверен, использует ли sync call разумное решение для этого.

Вам нужно будет повторно запустить метод проверки в форме отправки и отменить его там.

Посмотрите на плагин проверки jQuery, он поддерживает методы проверки удаления, которые очень просто работают с mvc.

http://bassistance.de/jquery-plugins/jquery-plugin-validation/

http://docs.jquery.com/Plugins/Validation/Methods/remote#options

Просто отключите кнопку отправки до завершения проверки.

Не лучше ли вам было бы привязать этот jquery к событию отправки формы, иначе это произойдет только тогда, когда пользователь покинет текстовое поле…

 $('.form-fields').bind({
        submit: function (e) {
            if (!Validate(e.target)) {
                cancel(e);
            }
        }
    });
  

Когда вы проверяете поле, добавьте valid класс к элементу, если он допустим. Затем, при отправке формы, просто проверьте, все ли поля имеют этот класс :

 $('#Form').submit(funciton(e){
    $(this).find('input').length == $(this).find('input.valid').length || e.preventDefault();
});
$('#Form input').bind({
    blur: function (e) {
        if(Validate(e.target))
           $(e.target).addClass('valid');
        else  
           $(e.target).removeClass('valid');
    }
});