I'm making a simple quiz using jquery and the validate plug-in. I
think I'm really close but just need a nudge over the last hump. :-)
I have a radio button group that requires the user to select at least
one button. That part is working. However, what I want to do is also
check to see if the user selected a certain button (i.e. the correct
answer). Only if the correct answer is satisfied will the form then
validate and move on to the next quiz question.
Here's my code so far. Any help is greatly appreciated.
<script type="text/javascript">
$.validator.setDefaults({
submitHandler: function() {
alert("Submitted!");
}
});
$.metadata.setType("attr", "validate");
$(document).ready(function() {
$("#quiz_form").validate();
});
</script>
</head>
<body>
<div id="main">
<form class="cmxform" id="quiz_form" method="get" action="">
<fieldset>
<fieldset>
<label for="answer1">
<input type="radio" id="answer1" value="1"
name="answers"
validate="required:true" />
Answer 1
</label>
<label for="answer2">
<input type="radio" id="answer2" value="2"
name="answers" />
Answer 2
</label>
<label for="answer3">
<input type="radio" id="answer3" value="3"
name="answers" />
Answer 3
</label>
<label for="answer4">
<input type="radio" id="answer4" value="4"
name="answers" />
Answer 4
</label>
<label for="answers" class="error">Please select an
answer.</label>
</fieldset>
<input class="submit" type="submit" value="Check
Answers"/>
</fieldset>
</form>
</div>
</body>
</html>
