jQuery: как включить проверку в функции ajaxForm?

Этот вопрос был задан, но ответ не подтвержден. Я пробовал, но это не сработало. Поэтому я хотел бы задать тот же вопрос еще раз (Уместно ли это? Если нет, пожалуйста, посоветуйте мне, что делать).

У меня есть форма, которую нужно проверить, а затем отправить с помощью ajaxForm (форма содержит данные изображения и файла, поэтому отправка с .serialize() не будет работать). Ниже приведены подробности:

HTML:

<form id="myForm" action="..." method="post" enctype="multipart/form-data">
  ...
  <input type="file" name="image" /><br />
  <input type="file" name="file" /><br />
  ...
</form>

jQuery:

$(document).ready(function() {

  $("#myForm").ajaxForm ({

    beforeSubmit: function() {
      $("#myForm").validate({
        onkeyup:false,
        rules: {
          ...
        },
        messages: {
          ...
        },
      });
    },

    success: function(returnData) {
      $('#content').html(returnData);
    }

  });

});

Часть ajaxForm в порядке. Но форма просто отправляется без проверки.


jquery jquery-validate ajaxform
person Randy Tang    schedule 10.03.2013    source источник

Ответы (3)


arrow_upward
6
arrow_downward

.validate() используется для инициализации подключаемого модуля в готовом к использованию DOM, поэтому вытащите его за пределы другая функция.

Инициализируйте два подключаемых модуля в DOM, а затем используйте любые соответствующие встроенные функции обратного вызова...

Вам не нужно беспокоиться о создании каких-либо новых функций обработчика submit или click, поскольку оба подключаемых модуля уже автоматически захватывают событие submit.

Рабочая демонстрация: http://jsfiddle.net/MF26D/

Преобразуйте свой код во что-то вроде этого:

$(document).ready(function () {

    $("#myForm").validate({ // initialize the plugin
        // any other options,
        onkeyup: false,
        rules: {
            //...
        },
        messages: {
            //...
        }
    });

    $("#myForm").ajaxForm({ // initialize the plugin
        // any other options,
        beforeSubmit: function () {
            return $("#myForm").valid(); // TRUE when form is valid, FALSE will cancel submit
        },
        success: function (returnData) {
            $('#content').html(returnData);
        }
    });

});
person Sparky    schedule 10.03.2013
comment
Ух ты! Код работает сразу. Миллион благодарностей, Спарки. Вы спасли мою жизнь. - person Randy Tang; 11.03.2013

arrow_upward
1
arrow_downward

попробуй это

   $(document).ready(function() {

      $("#myForm").ajaxForm ({

        beforeSubmit: function() {
           if (!$("#myform").valid())
                    return;
        },

        success: function(returnData) {
          $('#content').html(returnData);
        }

      });

    });
person PSR    schedule 10.03.2013
comment
Это кажется очень похожим на исходное решение. Как организовать функцию .valid()? - person Randy Tang; 10.03.2013

arrow_upward
1
arrow_downward

Можно вызвать плагин формы в обработчике отправки:

$("#myForm").submit(function(e){
  e.preventaDefault();

   var isValid=/* run your validation code that determines true or false*/

   if( isValid){
     $(this).ajaxForm({/* plugin options*/})
  }

})
person charlietfl    schedule 10.03.2013
comment
Извините, я не очень хорошо знаком с jQuery. Как установить значение переменной isValid функцией validation()? Спасибо. - person Randy Tang; 10.03.2013
comment
Используете ли вы плагин для проверки? Если да, то какой плагин (дайте ссылку на документы). - person charlietfl; 10.03.2013
comment
Я думаю, вам не хватает (function рядом с .submit. - person Sparky; 10.03.2013
comment
@Sparky ой..спасибо - person charlietfl; 10.03.2013
comment
Я использую плагин jzaefferer: github.com/jzaefferer/jquery-validation. - person Randy Tang; 11.03.2013
comment
попробуйте использовать ajaxSubmit в обратном вызове validate submitHandler. См. пример в документации по проверке плагинов: docs.jquery.com/Plugins/Validation/validate#toptions Никогда не было проблем с использованием submitHandler - person charlietfl; 11.03.2013