Javascript-форум (https://javascript.ru/forum/)
-   jQuery (https://javascript.ru/forum/jquery/)
-   -   Валидация формы (https://javascript.ru/forum/jquery/12852-validaciya-formy.html)

dmsuslov 05.11.2010 13:53

Валидация формы
 
Есть задача: при сабмите формы прежде сделать валидацию ее полей, и если все в порядке - выполнить сабмит.
Для этого я вешаю обработчик на форму. Валидацию провожу с помощью AJAX-запроса к серверу. Результат проверки ловлю в колбек-функции запроса:

// обработчик формы
$('#my_form').submit(function () {
// тут AJAX'ом проверяю поля:
$.post('script.php', {f1: $('#field1').val(), f2: $('#field2').val()}, function (result) {
// вот тут я вижу результат проверки
})
});

Но если результат проверки отрицательный, то false должна вернуть функция-обработчик формы. Т.е. как мне из колбека ajax-вызова "выбраться" в обработчик формы?
Кстати, вызов асинхронный, что усложняет дело...

micscr 05.11.2010 14:04

$('#my_form').submit(function () {
// тут AJAX'ом проверяю поля:
$.post('script.php', {f1: $('#field1').val(), f2: $('#field2').val()}, function (result) {
// вот тут я вижу результат проверки
if (все OK) {
  // делай сабмит
  $('#my_form').submit();
}
})
return false; // чтобы сабмит не происходил, т.к. тут ответа никогда не будет.
});

monolithed 05.11.2010 14:08

<style>
.invalidate {color:red;}
.validate {color: green;}
</style>
<script src="http://code.jquery.com/jquery-latest.min.js"></script>
<p>Введите корректные данные</p>
<form action="#">
      <input type="text" />
      <input type="submit" />
</form>
<div></div>
<script>
$("form").submit(function() {
    if (/\d+/.test($("input:first").val())) {
        $("div").text("Правильно...").addClass('validate').show();
        return true;
   }
   $("div").text("Неправильно!").removeClass('validate').addClass('invalidate').show().fadeOut(1000);
      return false;
   });
</script>

micscr 05.11.2010 14:14

в моем примере еще может флажок выставлять, что форма уже проверена, чтобы бесконечно не гоняло.

dmsuslov 05.11.2010 15:12

Гран мерси! Простое и изящное решение. Наверное, я заработался, поэтому и не увидел его сам, а стал решать задачу "в лоб" :-)


Часовой пояс GMT +3, время: 14:58.