Robert Parry Robert Parry - 5 years ago 776
Javascript Question

Using jQuery to switch to focus a tab with a validation error

I'm trying to get jQuery to switch to a tab if it finds an error on it. Right now it will find an error but won't go to the tab with the error.

This is the code I currently have

<script type="text/javascript">
jQuery(document).ready(function() {
jQuery('#Form').validate({
ignore: ".ignore",
invalidHandler: function(){
jQuery("#tabs").tabs("select", jQuery("#Form .input-validation-error").closest(".tab-pane").get(0).id);
}
});
});

jQuery('.Submit').click(function(evt) {
evt.preventDefault();
jQuery('#Form').submit()
});
</script>

Answer Source

Try

jQuery('#userEditForm').validate({
    ignore: ".ignore",
    invalidHandler: function(e, validator){
        if(validator.errorList.length)
        $('#tabs a[href="#' + jQuery(validator.errorList[0].element).closest(".tab-pane").attr('id') + '"]').tab('show')
    }
});

Demo: Fiddle

Recommended from our users: Dynamic Network Monitoring from WhatsUp Gold from IPSwitch. Free Download