Проверка формы: если есть ошибки, не анимируйте аккордеон

Question

Проверка формы: если есть ошибки, не анимируйте аккордеон

0

Я использую плагин jQuery Validation на awsAccordion. Я хочу открыть следующую вкладку моего аккордеона после того, как проверка будет выполнена без ошибок.

Это то, что я сделал: http://jsfiddle.net/vqL4p/7/

$('#myform').validate({ // initialize the plugin
    rules: {
        field1: {
            required: true,
            email: true
        },
        field2: {
            required: true,
            minlength: 5
        }
    },
    invalidHandler: function(form, validator){ //if there is error
        var errors = validator.numberOfInvalids();
        var message = (errors == 1) ? "One of your groups won't validate." : "Neither of your groups will validate.";
        alert(message);
        $('dt').unbind('click'); //if there is error remove click on the tab
    },
    submitHandler: function (form) { 
        alert('valid form submitted'); 
        return false;
        }
});

$('dt').click(
    function(e){
    $("#myform").valid();
});

Проблема в том, что unbind click $('dt').unbind('click'); работает только после закрытия вкладки и открытия следующего. Вы знаете способ решить эту проблему?
Спасибо огромное!

Mustapha Aoussar 27 нояб. 2013, в 22:24

Источник

Теги:

javascript

jquery

jquery-validate

1 ответ

Ещё вопросы

PSL · Accepted Answer · 2013-11-27T19-39-00.000Z

Вам не нужно отвязывать событие клика, вместо этого вам просто нужно прекратить распространение и предотвратить запуск остальных обработчиков с помощью event.stopImmediatePropagation(). И проверьте правильность формы внутри события click, используя !$("#myform").valid().

Пытаться:

     $('dt').click(function(e){
       if(!$("#myform").valid()){ //Check if form is valid or not
           e.stopImmediatePropagation(); //stop rest of the handlers from being executed
       };
     });


     $('#myform').validate({ // initialize the plugin
        rules: {
            field1: {
                required: true,
                email: true
            },
            field2: {
                required: true,
                minlength: 5
            }
        },
        invalidHandler: function(form, validator){
            var errors = validator.numberOfInvalids();
            var message = (errors == 1) ? "Validated." : "Error! the field is required";
        },

        submitHandler: function (form) { 
            alert('valid form submitted'); 
        }
    });


    $("#accordion1").awsAccordion({
            type:"horizontal",
            cssAttrsHor:{
                ulWidth:"responsive",
                liWidth:50,
                liHeight:300
            },
            startSlide:1,
            openOnebyOne:true,
            classTab:"active",
            slideOn:"click",
            autoPlay:false,
            autoPlaySpeed:500
    });

демонстрация