jQuery validate: вызов функции после проверки формы

Question

Я пытаюсь вызвать функцию, которая сохранит мою форму.

Вот мой код:

$('#save-form-datas').validate({
    rules: {
        ROO_Number: {
            required: true,
            minlength: 1,
            maxlength: 4
        }
    },
    submitHandler: function(form) {
        var formData = new FormData(form);
        saveFormDatas(form);
    }
});

Но когда код выполняется, он не работает.

Вот код функции, которую я хочу выполнить сразу после проверки for:

function saveFormDatas(form) {

    $.ajax({
        type : 'POST',
        data : form.serialize(),
        url  : 'assets/app/php/ajax/rooms_edit.php',
        success: function(responseText){
            var json = $.parseJSON(responseText);
            if(json.type=="success") {
                $('#status-message-saved.hide').removeClass('hide');

                if(json.return_url!="") { 
                    setTimeout(function(){ window.location.href = "app?q=" + json.return_url; }, 1000);
                }
            }
            if(json.type=="error") {
                $('#status-message-error.hide').removeClass('hide');
            }
        }
    });
}

Но это не работает, и просто откройте новую страницу, как это, я передал форму с $_GET (все мои данные формы находятся в URL).

Мне нужно сделать так, потому что у меня есть более 100 форм и я не могу дублировать мой код для сохранения форм.

Спасибо за вашу помощь.

Answer 1

Просто удалите submitHandler из валидатора и добавьте внешнюю функцию.

$('#save-form-datas').validate({
 rules: {
    ROO_Number: {
        required: true,
        minlength: 1,
        maxlength: 4
    }
 }
});

Обработайте форму, как показано ниже.

$('#save-form-datas').submit(function(event){
    event.preventDefault();
    if($('#save-form-datas').valid()){
        var form = $('#save-form-datas')[0];
        var formData = new FormData(form);
        saveFormDatas(form);
    }
});

Или же вы можете просто добавить "return false", как показано ниже...(Это предотвратит отправку формы по умолчанию)

$('#save-form-datas').validate({
 rules: {
    ROO_Number: {
        required: true,
        minlength: 1,
        maxlength: 4
    }
 },
 submitHandler: function(form) {
    var formData = new FormData(form);
    saveFormDatas(form);
    return false;
 }
});

Answer 2

Я сделал с этим в моем коде

$('#save-form-datas').validate({
    rules: {
        ROO_Number: {
            required: true,
            minlength: 1,
            maxlength: 4
        }
    }
});

здесь вы можете проверить, если форма действительна или нет

if($('#save-form-datas').valid()){
      function myfunction()
}

myfunction {

$.ajax({
        type : 'POST',
        data : $('#save-form-datas').serialize(),
        url  : 'assets/app/php/ajax/rooms_edit.php',
        success: function(responseText){
            var json = $.parseJSON(responseText);
            if(json.type=="success") {
                $('#status-message-saved.hide').removeClass('hide');

                if(json.return_url!="") { 
                    setTimeout(function(){ window.location.href = "app?q=" + json.return_url; }, 1000);
                }
            }
            if(json.type=="error") {
                $('#status-message-error.hide').removeClass('hide');
            }
        }
    });
}

Надеюсь это поможет.

Answer 3

jQuery Validate предоставляет параметр option под названием showErrors , который получает карту и список ошибок. Все, что вам нужно сделать, это привязать туда:

      $("#myform").validate({
  showErrors: function(map,errors) {
    var validator = this;
    onValidate(validator);
    return validator.defaultShowErrors(map,errors);
  }
});

function onValidate(validator) {
  var isValid = validator.valid();
  // do something ...
}

Кроме того, вы можете принудительно выполнить проверку один раз, когда загружается Javascript, для инициализации, кнопок и прочего: $("#myform").data('validator').form();