I have a form where I use a select dropdown from which the user makes a selection.
Based on the selection made, only certain fields are displayed and only those will require validation.
This I achieve using some jQuery and it's working very well. The script also adds or removes (where applicable) the "validate['required']" type classes to the fields. This I can clearly see happening using fireBug.
The problem is that when submitting the form, the fields that are not displayed (and with no "validate['required']" classes), are still being flagged through the validation script.
From this, I presume that the validation script is loaded fhen the form is loaded through the show html action. Even though the validation script may only be triggered on submit, it appears as if it had scanned the html for the "validate['required']" type classes when it was loaded and is therefore totally unaware of the changes that have occured in the html since then.
Is there any way of "reloading" the validation script when submitting, so that it can scan the changed form html?
Thanks in advance for your assistance
Regards
Joe
Based on the selection made, only certain fields are displayed and only those will require validation.
This I achieve using some jQuery and it's working very well. The script also adds or removes (where applicable) the "validate['required']" type classes to the fields. This I can clearly see happening using fireBug.
The problem is that when submitting the form, the fields that are not displayed (and with no "validate['required']" classes), are still being flagged through the validation script.
From this, I presume that the validation script is loaded fhen the form is loaded through the show html action. Even though the validation script may only be triggered on submit, it appears as if it had scanned the html for the "validate['required']" type classes when it was loaded and is therefore totally unaware of the changes that have occured in the html since then.
Is there any way of "reloading" the validation script when submitting, so that it can scan the changed form html?
Thanks in advance for your assistance
Regards
Joe
Hi Joe,
The classes are only used when the form loads, any changes to the classes after that have no effect on the validation unless you re-initialise it.
There are a couple of fixes. The simplest is to add validation to all of the inputs then disable the ones that you want to hide - disabled inputs aren’t validated. You can see that in this FAQ
The second approach is more complex - you can add or remove FormCheck validations with the register() and dispose() methods (and reinitialise() if you really need it). See the FormCheck docs and some examples in this post - see the makeRequired, makeDisabled, makeOptional functions.
Bob
The classes are only used when the form loads, any changes to the classes after that have no effect on the validation unless you re-initialise it.
There are a couple of fixes. The simplest is to add validation to all of the inputs then disable the ones that you want to hide - disabled inputs aren’t validated. You can see that in this FAQ
The second approach is more complex - you can add or remove FormCheck validations with the register() and dispose() methods (and reinitialise() if you really need it). See the FormCheck docs and some examples in this post - see the makeRequired, makeDisabled, makeOptional functions.
Bob
Hi Bob,
Thanks for the advice. This is how I solved the problem.
1. I added a "canHide validate['required']" class in the form html for all the fields that can be hidden
2. In my jQuery script, I used "$(".canHide").attr("disabled","disabled");" to add a disabled tag to all fields with the canHide class
3. Then based on a test for which option was selected, I used "$(selectOptionId).removeAttr("disabled");" to enable ony the displayed fields.
This seems to work very well. Tested on firefox and chrome, yet to test it on IE.
Thanks for the great advice
Joe
Thanks for the advice. This is how I solved the problem.
1. I added a "canHide validate['required']" class in the form html for all the fields that can be hidden
2. In my jQuery script, I used "$(".canHide").attr("disabled","disabled");" to add a disabled tag to all fields with the canHide class
3. Then based on a test for which option was selected, I used "$(selectOptionId).removeAttr("disabled");" to enable ony the displayed fields.
This seems to work very well. Tested on firefox and chrome, yet to test it on IE.
Thanks for the great advice
Joe
This topic is locked and no more replies can be posted.
