I’m using validator.js v0.10.2 by Cina Saffary with very good luck, but I’ve run into a problem.
I’ve got a few forms that show/hide fields based on previous choices.
For example, something like:
How Many Companions Are Traveling With You?
Check “1”, separate name, address, and email fields for that companion will display.
Check “More Than One”, they get a single text area prompting for everybody’s name and info.
So the problem is, ONLY the showing field(s) need to be required, not the hidden one(s), otherwise you can never submit the form because you never see the field that the validation wants you to fill in.
How can I get it to ignore fields that are hidden using the show/hide code below? Ideas?
A typical form field looks like (this one isn’t from the example):
<label class="desc" for="prim_email"> Email </label>
<input id="prim_email" name="prim_email" type="email" class="form-control" value="<?php echo $tE['prim_email']; ?>" required data-error="Invalid Email Address" />
<div class="help-block with-errors"></div>
Show/Hide code looks like:
$(document).ready(function(){
$("input[name$='beneficiary_num']").click(function(){
var radio_value = $(this).val();
if(radio_value=='1') {
$("#single").show("slow");
$("#multiple").hide("slow");
}
else if(radio_value!='1') {
$("#single").hide("slow");
$("#multiple").show("slow");
}
});
$('[name="beneficiary_num"]:checked').trigger('click');
});