StackOverflow2013

Note that there are some explanatory texts on larger screens.

plurals

PO
text
Body
copied!<p>Are you asking how you can use the plugin? It's pretty well-documented, but anyway these snippets should assist. Here I take a simple form with two lots of radio-button groups, validate them using the plugin. The main things to note in the validation code are that we have two handler callbacks (for 'invalid' and 'success' states) plus a set of validation rules to apply.</p> <p>First, the example form:</p> <pre><code><form id="your-form"> <fieldset> <p> <label for="group_one">Select an option (required)</label> <input type="radio" name="group_one" id="opt1-1">Option 1 <input type="radio" name="group_one" id="opt1-2">Option 2 <input type="radio" name="group_one" id="opt1-3">Option 3 </p> <p> <label for="group_two">Select an option here too (required)</label> <input type="radio" name="group_two" id="opt2-1">Option 1 <input type="radio" name="group_two" id="opt2-2">Option 2 <input type="radio" name="group_two" id="opt2-3">Option 3 </p> <p><input name="submit" type="submit" id="submit" value="Save" /></p> </fieldset> </form> </code></pre> <p>… and second, the validation code:</p> <pre><code>$(document).ready(function(){ $("#your-form").validate({ invalidHandler: function(form, validator){ var errors = validator.numberOfInvalids(); var message = (errors == 1) ? "One of your groups won't validate." : "Neither of your groups will validate."; alert(message); }, submitHandler: function(){ alert("Everything's OK, both radio button groups are set."); $('#your-form').ajaxSubmit() }, rules: {group_one: {required: true}, group_two: {required: true}} }); }); </code></pre> <p>Does that help?</p>

Querying!

Guidance

An individual column

Larger individual text columns get their own page to allow for proper reading.

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload