Jquery bootstrap select2 plugin issue with validate plugin

Question

In my bootstrap project I\'m trying to use the plugin select2 but I realized that if you use this plugin are no longer able to validate select fields in my form with validat

Answer 1

Ok. Here is what worked for me

/* select 2 plugin */
$('select#foo').select2();

/* Validation */
    $("#test_form").validate({
        ignore: 'input[type=hidden]',
        rules:
        {
            foo: { required: true },
            bar: { required: true }
        },
        errorPlacement: function (error, element) {
            $(element).parent().addClass('has-error');
        },
        success: function (label, element) {
            $(element).parent().removeClass('has-error');
        },
        submitHandler: function(form) {
            alert("validation ok");
        }
    });

I added a "ignore: 'input[type=hidden]'," option because the Select2 script adds a hidden option to the original input and the Jquery Validator seems to ignore it. Then i changed the error class from "err" on the element to "has-error" on the parent element (the div with form-group class)