Проверить отдельные вкладки плагин Jquery Validator

0

Я использую следующий скрипт Jquery Validator;

jQuery.validator.addMethod("letras", function (value, element) {
    return this.optional(element) || value == value.match(/^[a-zA-Z ñÑáéíóúüç]+$/);
}, "Only letters.");

$(document).ready(function () {

        $('#inscripcion').validate({

                errorClass: 'form-control-error',
                validClass: 'form-control-sucess',
                ignore: "",

                submitHandler: function (form) {
                    if ($("#inscripcion").validate() == true) {
                        alert("Form not completed");
                    } else {
                        form.submit();
                    }
                },

                rules: {

                    nombrer: {
                        minlength: 2,
                        letras: true,
                        required: true
                    },
                    apellidor: {
                        minlength: 2,
                        required: true
                    },
                    cedular: {
                        minlength: 7,
                        number: true,
                        required: true
                    },

                    highlight: function (element) {
                        $(element).closest('.form-group').removeClass('has-success').addClass('has-error');
                    },

                    success: function (element) {
                        $(element).closest('.form-group').removeClass('has-error').addClass('has-success');

                    }
                });
        }); // end document.ready

    $('#menu a[href="#estudiante"]').click(function (event) {
        var estado = $('#inscripcion').valid();
        if (estado == false) {
            alert("You miss some data please complete it");
        }
    });

    $('#botonestu').click(function (event) {
        var estado = $('#inscripcion').valid();
        if (estado == false) {
            alert("You miss some data please complete it");
        }
    });

Проблема в том, что если я использую "игнорировать:", "события, которые я сделал, когда кто-то щелкает вкладку или кнопку, активируется, даже если вкладка especified заполнена. Но если я удалю, кто-то может нажать кнопку "Отправить" напрямую, и она представит всю форму, даже если она будет пустой. А также "alert" в submitHandler его не работает даже в form.submit().

  • 0
    Показать достаточно HTML, чтобы построить краткий пример.
Теги:
jquery-validate

1 ответ

0
Лучший ответ

Ваш код:

submitHandler: function (form) {
    if ($("#inscripcion").validate() == true) {
        alert("Form not completed");
    } else {
        form.submit();
    }
},
  • $("#inscripcion").validate() в этом контексте совершенно бессмысленна. .validate() - это только метод инициализации плагина, а не метод тестирования. Вызов .validate() более одного раза ничего не сделает.

  • Согласно документации, submitHandler только при нажатии кнопки отправки, когда форма действительна. Это означает, что тестирование на достоверность в submitHandler является излишним. Другими словами, этот тест внутри submitHandler не имеет смысла, потому что всякий раз, когда ваш, if valid оператор оценивается, форма уже всегда.

  • Если все, что вы хотите сделать, это form.submit(), тогда необходимо submitHandler весь submitHandler обратного вызова submitHandler. Это поведение по умолчанию для плагина, которое вам не нужно перегружать. Обычно submitHandler вызов submitHandler используется, когда вы хотите отправить данные формы с помощью .ajax() и/или выполнять другие действия, когда форма действительна.


Я не уверен, чего вы хотите достичь с ignore: "", однако, если вы пытаетесь включить проверку скрытых полей, используйте ignore: []. В противном случае, если вы хотите, чтобы скрытые поля игнорировались для проверки, полностью удалите параметр ignore, поскольку это уже поведение по умолчанию для плагина.


Вы также неправильно разместили highlight и success внутри rules а также отсутствующую закрывающую фигуру по rules:

$(document).ready(function () {

    $('#inscripcion').validate({
        // your other options,
        rules: {
            nombrer: {
                ...
            },
            ....
            highlight: function (element) { // <- incorrectly placed inside "rules" option
                $(element).closest('.form-group').removeClass('has-success').addClass('has-error');
            },
            success: function (element) {  // <- incorrectly placed inside "rules" option
                $(element).closest('.form-group').removeClass('has-error').addClass('has-success');

            }
        // <- missing a closing brace "}" here
    });

}); // end document.ready 

Вот рабочая версия вашего кода: http://jsfiddle.net/yyxLs/

  • 0
    Спасибо, я только что проверил свой код и исправил те недостающие скобки, и это работало!

Ещё вопросы

Сообщество Overcoder
Наверх
Меню