jquery validate plugin - ignore not visible inputs, but include hidden inputs with class

Question

I have a form that changes the inputs displayed on screen depending on a drop down list value.
This ignore definition works fine and does not validate any inputs with ignore class and that are not visible.

ignore: ":not(:visible), .ignore",

But the problem now is when I want to validate a few hidden inputs with class 'validate' , so I changed this to:

ignore: ":hidden:not(.validate), :not(:visible), .ignore",

But the :not(:visible) blocks it. How to apply these 2 rules together so I will be able to ignore not visible inputs and validate hidden inputs with 'validate' class?

FYI - "not visible" means "hidden", which includes, type="hidden", display:none and most other common techniques that hide the element from view. I'm making this point because the plugin already ignores these things by default using :hidden. — Sparky
– Sparky, Commented Nov 30, 2016 at 0:09

Sparky · Accepted Answer · 2016-11-29 17:58:53Z

4

If you want to ignore all hidden elements, but still validate any hidden element with the .validate class, it's simply the default :hidden selector with the .validate class excluded...

ignore: ":hidden:not(.validate)"

DEMO: jsfiddle.net/0avft8ou/

You probably don't need an .ignore class because the plugin will automatically ignore any hidden element.

answered Nov 29, 2016 at 17:58

Sparky

98.8k26 gold badges202 silver badges293 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

Offir Over a year ago

I know that sparky, but I want also not to validate all the not visible inputs, I have inputs that their container has a display:none that I don't want to validate them + don't validate hidden inputs unless they have the validate class. Look at what I tried.

Sparky Over a year ago

@OffirPe'er, I don't think you tried my demo. By default, the plugin will ignore ALL hidden elements including display:none. See this: jsfiddle.net/0avft8ou/1

muhammad waqas · Accepted Answer · 2016-11-29 11:08:05Z

-1

Try changing your first rule as

ignore: ":not(:visible), :not(:hidden), .ignore"

answered Nov 29, 2016 at 11:08

muhammad waqas

7401 gold badge5 silver badges21 bronze badges

4 Comments

Offir Over a year ago

I tried this already, I thought maybe it would overwrite it, but it's not. Also I tried hidden:not(.validate)!important but that caused an error.

muhammad waqas Over a year ago

as far as I know about jquery.validate , it works (or it can work) on elements based on the names, i.e. we apply validations for individual fields, then why your validations are being conflicted with each other.??

Offir Over a year ago

Maybe the algorithm that applies to :not(:visible) has a conflict with :not(:hidden) , you are more then welcome to create a fiddle proving me wrong.

Sparky Over a year ago

:not(:visible) and :not(:hidden) are opposite of each other, and by using both together, you're ignoring EVERYTHING.

Collectives™ on Stack Overflow

jquery validate plugin - ignore not visible inputs, but include hidden inputs with class

2 Answers 2

2 Comments

4 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

2 Comments

4 Comments

Your Answer

Sign up or log in

Post as a guest

Related