[jQuery] Making sure a radio button is checked
My HTML:
<table class="Zebra" width="100%">
<thead>
<tr class="zSelected"><td colspan="2">Employee Engagement</td></tr>
</thead>
<tbody>
<tr class="zOdd"><td>1. I am proud to be part of the [redacted].</
td><td nowrap="nowrap" valign="top">
1<input value="1" name="p1q1" type="radio">
2<input value="2" name="p1q1" type="radio">
3<input value="3" name="p1q1" type="radio">
4<input value="4" name="p1q1" type="radio">
5<input value="5" name="p1q1" type="radio">
</td></tr>
<tr class="zEven"><td>2. I see myself working for the [redacted] three
years from now.</td><td nowrap="nowrap" valign="top">
1<input value="1" name="p1q2" type="radio">
2<input value="2" name="p1q2" type="radio">
3<input value="3" name="p1q2" type="radio">
4<input value="4" name="p1q2" type="radio">
5<input value="5" name="p1q2" type="radio">
</td></tr>
<tr class="zOdd"><td>3. The work I do is very important to the success
of our organization.</td><td nowrap="nowrap" valign="top">
1<input value="1" name="p1q3" type="radio">
2<input value="2" name="p1q3" type="radio">
3<input value="3" name="p1q3" type="radio">
4<input value="4" name="p1q3" type="radio">
5<input value="5" name="p1q3" type="radio">
</td></tr>
</tbody></table>
Before submit, I run this function to make sure that all of the radio
groups have one of the answers checked.
$('#frmSurvey').ajaxForm({
beforeSubmit: validate_form,
target: '#ContentTwo',
type: 'post',
url: '/SCFox.survey?&Prog=SaveSurvey'
});
function validate_form ( )
{
valid = true;
if ( ( document.survey.question1[0].checked == false )
&& ( document.survey.question1[1].checked == false )
&& ( document.survey.question1[2].checked == false )
&& ( document.survey.question1[3].checked == false )
&& ( document.survey.question1[4].checked == false ))
{
alert ( "Please answer question #1" );
valid = false;
}
if ( ( document.survey.question2[0].checked == false )
&& ( document.survey.question2[1].checked == false )
&& ( document.survey.question2[2].checked == false )
&& ( document.survey.question2[3].checked == false )
&& ( document.survey.question2[4].checked == false ))
{
alert ( "Please answer question #2" );
valid = false;
}
if ( ( document.survey.question3[0].checked == false )
&& ( document.survey.question3[1].checked == false )
&& ( document.survey.question3[2].checked == false )
&& ( document.survey.question3[3].checked == false )
&& ( document.survey.question3[4].checked == false ))
{
alert ( "Please answer question #3" );
valid = false;
}
return valid;
}
There has to be a better jQuery way of doing this. I'm using the
pager plugin to seperate the 8 pages of questions, so the validation
plugin would be tough to use as the error could appear on a hidden
page. I'm just looking to alert the user that a particular question on
a particular page needs to be answered before they can submit their
survey. I'm sure that a 'for' loop of some sort would be involved, but
I don't know a thing about them.
Any assistance appreciated.
Thank you,
Shaun