Twitter Bootstrap and jQuery Validation Plugin - use class=“control-group error”

Question

I\'ve created a form using the Twitter Bootstrap framework and have integrated the jQuery Validation Plugin. I have one form with a series of yes/no questions with radio buttons

Answer 1

To use the control-group the way bootstrap was intended to be used, you want to set the value of the surrounding control-group. The accepted answer isn't quite right, you don't want to put control-group on the input itself, but the container. This code should work.

$("#page-form").validate({
        highlight: function (element, errorClass, validClass) {
            $(element).closest(".control-group").addClass(errorClass).removeClass(validClass);
        },
        unhighlight: function (element, errorClass, validClass) {
            $(element).closest(".control-group").addClass(validClass).removeClass(errorClass);
        }
    });