validating all tabs on form submit #279

Closed
prithivirajan opened this Issue Dec 9, 2011 · 20 comments

Comments

Projects
None yet

Currently validation happens only on the selected tab. But like to have the validation happening for all the tabs on form submit, would be workaround to achieve this?

This is on one single form.

bhendel commented Dec 21, 2011

Same issue, even with 1.9. It only validates the currently selected tab. Weird thing is that I thought that I had this working before. I have one form spanning ALL tab divs, and running jQuery 1.7, Validate 1.9.

Edit: I checked an old version of this app, and it IS working fine! I am trying to backtrack my steps to see if an update of a library, or the app itself, broke this somehow.

I had done a work around to get it work, by selecting each tab through code
and iterate through all input element and call the validate for each
element.

var valid1 = true;
$( "#tabs" ).tabs( "option", "selected", 0 );
$("#fragment-1").find(".check:not(:hidden,:button)").each( function(){
if( !validator.element(this) && valid1 )
valid1 = false;
});

-Prithivi

On Wed, Dec 21, 2011 at 11:39 AM, bhendel <
reply@reply.github.com

wrote:

Same issue, even with 1.9. It only validates the currently selected tab.
Weird thing is that I thought that I had this working before.


Reply to this email directly or view it on GitHub:

jzaefferer#279 (comment)

I also hit this problem, I just stored instances of all of the hidden inputs (select, textarea, etc), marked them as visible, performed the validation and hid them again, not ideal in any circumstances but it works for now

bhendel commented Dec 21, 2011

Ok I've confirmed this in my app. The old Validate 1.7 works fine. Switching to the new 1.9 fails! Only validates the selected tab. Switching from jQuery 1.6.2 to 1.7 has no affect. Seems like something in the space between validate 1.7 and 1.9 broke multi-tab validation!

So guys, try the old 1.7 and see if it works. It does for me!

-Brian

Works on 1.8.1 too... so must be something in 1.9 that broke it

temple commented Jan 10, 2012

Why don't you redefine jquery UI stylesheet?
It's enough by doing following replacement:

/.ui-tabs .ui-tabs-hide { display: none !important; }/
.ui-tabs .ui-tabs-hide { height:0px;overflow:hidden;}

bhendel commented Jan 10, 2012

Mmm. Wouldn't that show all tabs? This was functionality working in 1.7 and 1.8, and is not working in 1.9. I think the solution is to fix the issue in the library, not hack the CSS or try for dirty workarounds.

temple commented Jan 10, 2012

Yes you're right, in last thing you say.
But sometimes wait for fixing is like being a mamout against being a bird.

Let me say that "hack CSS" is not a crime.

Finally, has any developer post a reply? Do they keep in mind?

sammyhk commented Jan 18, 2012

Hi all, please read the changelog before upgrading the library:
http://jquery.bassistance.de/validate/changelog.txt

1.9.0

...

  • Fixed #189 - :hidden elements are now ignored by default

For more information of the issue, please read:
jzaefferer#189

bhendel commented Jan 18, 2012

That's painful. What is the best way to disable this logic and have it continue validating all fields?

Thanks.

-Brian

lamaral commented Jan 18, 2012

I found the fix!
Based on what sammyhk said, I removed "ignore: ":hidden"," from line 217 and it is now working with JQuery UI tabs.

bhendel commented Jan 18, 2012

There should be some way without hacking the library however.

lamaral commented Jan 18, 2012

Why you consider this a hack?
I removed the line which ignores the hidden elements. I think that there is no other way of getting it to work with the hidden elements. In my case, it's good because I don't use hidden fields. For the people in the same situation than me, it can be considered a fix.

bhendel commented Jan 18, 2012

But you changed the actual library file itself? That's a hack. The library SHOULD have an interface in the config function to be able to change this logic after integration. Otherwise your change will be wiped out when you upgrade to the next version.

It would be unfortunate if the plugin developer hard-coded this change and did not allow some some of "configuration" parameter.

-Brian

lamaral commented Jan 18, 2012

I found a way without hack, just add ignore: "" on the options list.
$("#form").validate({
...
rules: {...},
messages: {...},
ignore: "",
...
});

bhendel commented Jan 18, 2012

Interesting. So you just told it to ignore nothing? Nice!

I think it is because of the following default setting which was added in 1.9 version ignore: ":hidden". I faced the same issue during my upgrade and fixed it by overriding the default option value as ignore: "".

I've actually changed the default option value in my valodation.js file so that it is global.

Instead of changing the library, or setting it in your validate options, you should use $.validator.setDefaults(), like so:

$.validator.setDefaults({
    ignore: ""
});

The above only needs to be called once, when the document is ready.

Contributor

mlynch commented Apr 18, 2012

Closing since this can be done already as @counsellorben describes.

mlynch closed this Apr 18, 2012

Hello All ;
I tried above all option ..........but it does not works for me

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment