jQuery Validate usage / syntax
in Using jQuery Plugins
•
10 years ago
Still a raw beginner and trying to figure out how to get better control of the validate plugin. It's working at the most basic level, so I feel kind of good about that. Now it's time to do a couple more advanced things that I see in the documentation but don't really know how or where the code goes.
I'm just using the standard call for the validate plugin:
- $(document).ready(function(){
$(".cjrForm").validate();
});
Here's my form - pretty straight-forward:
<form id="ownerForm" class="cjrForm" action="ownerForm.php" method="POST" name="ownerForm">
<p>
<label for="firstName" class="cjrLabel">Your name: </label>
<input name="firstName" id="firstName" placeholder="First Name" class="required" minlength="2" title="Please supply your full name." type="text" />
<input name="lastName" id="lastName" placeholder="Last Name" class="required" minlength="2" title="Please supply your full name." type="text" />
</p>
<p>
<label for="address" class="cjrLabel">Address: </label>
<input name="address" id="address" class="required" minlength="5" placeholder="Street address" size="43"
title="A valid street address is required" type="text" />
<i> NO City, ST/Province! </i>
</p>
<p>
<label for="zipCode" class="cjrLabel">ZIP / Postal Code: </label>
<input name="zipCode" id="zipCocde" class="required" placeholder="Postal Code" minlength="5" maxlength="7" type="text" />
<i>Canadian Post - Please INCLUDE the space (X9X 9X9)</i>
</p>
<p>
<label for="phone" class="cjrLabel">Phone: </label>
<input name="phone" id="phone" placeholder="Phone number" maxlength="12" type="text" />
</p>
<p>
<label for="email" class="cjrLabel">email: </label>
<input name="email" id="email" placeholder="email Address" size="43" class="required email" maxlength="120" type="text />
</p>
<p><label for="submit" class="cjrLabel"> </label> <input name="submit" value="Submit" type="submit" /></p>
</form>
The firstName and lastName fields are side-by-side. Rather than having the error for the first name come up IN BETWEEN the two name fields, I see that there is a way to Group the two fields, and there is also a way to specify "placement" of the error message maybe UNDER both and above the address field. I found the explanation that these things can be done, but didn't see an example that could really help me figure out where to put the code.
Anyone?
Thanks for your assistance!
1