jQuery selector for hidden elements except

Question

By default, jQuery Validation ignores hidden elements:

ignore (default: ":hidden")

Type: Selector

Elements to ignore when validating, simply filtering them out. jQuery’s not-method is used, therefore everything that is accepted by not() can be passed as this option. Inputs of type submit and reset are always ignored, so are disabled elements.

Here's the relevant code from jquery.validate.js:

elements: function() {
    var validator = this,
        rulesCache = {};

    // select all valid inputs inside the form (no submit or reset buttons)
    return $( this.currentForm )
    .find( "input, select, textarea" )
    .not( ":submit, :reset, :image, [disabled]" )
    .not( this.settings.ignore )
    .filter( function() {
        // snip
    });
}

The problem I'm having is due to the fact that I'm also using TinyMCE. When TinyMCE is applied to a textarea, it hides the textarea and creates an iframe in its place. This means jQuery Validation ignores it by default.

I can force the validation to pickup the hidden textareas by changing the value of the ignore option to null:

$("#myform").validate({
    ignore: null
});

Unfortunately this creates a huge performance issue on my page which has hundreds of hidden input fields. It's so bad it actually crashes Chrome and IE (Firefox is a champ, but still slow).

I think what I need to solve this problem is a jQuery selector for hidden elements except those with a certain class name, or something like this:

$("#myform").validate({
    ignore: ':hidden(:not(textarea.tinymce))'
});

I realize this is an invalid selector. Is there a selector like this? If not, is there a better way that I'm not seeing to tell jQuery Validation to ignore all the hidden elements except those hidden by TinyMCE?

Answer 1

Special selectors usually go after other selectors (except in the case of not and is and a couple others:

":hidden:not(textarea.tinymce)"