Hi,
How can I do validation on a group of input fields, as long as one of
the 3 fields have a value then it's valid,
I've managed to group them, but it's showing up with 3 error messages
instead of one. How can I get it to display just the one error msg for
all 3 input fields?
Here's my validation js.
var container = $('#errorContainer');
var validator = $("#contactform").validate({
rules: {
firstname: "required",
lastname: "required",
email: {
required: true,
email: true
}
},
errorContainer: container,
errorLabelContainer: $("ol", container),
wrapper: 'li',
meta: "validate"
});
// test either 1 of 3 contact method is provided
jQuery.validator.addMethod('required_group', function(val, el) {
var $module = $(el).parents('#contactform');
return $module.find('.required_group:filled').length;
}, 'Please provide either an email address, home phone or mobile for
us to get in touch with you.');
--------------------------------------------------
HTML below:
<form action="" method="get" id="contactform">
<div class="error"></div>
<ol>
<li>
<label for="firstname">First name:
*</label>
<input id="firstname" name="firstname"
class="text" />
</li>
<li>
<label for="lastname">Last name:
*</label>
<input id="lastname" name="lastname"
class="text" />
</li>
<li>
<label for="email">Email Address:
**</label>
<input id="email" name="email"
class="text required_group" />
</li>
<li>
<label for="mobile">Mobile Phone:
**</label>
<input id="mobile" name="mobile"
class="text required_group" />
</li>
<li>
<label for="phone">Home Phone:
**</label>
<input id="phone" name="phone"
class="text required_group" />
</li>
</ol>
</form>
