...

View Full Version : help with checkbox array



finstah1
06-27-2007, 08:21 PM
I have two sets of checkboxes on my page. The first set, if I plan to attend radio button is selected then 1 of the 4 checkboxes are required:

Instead of writing out 4 separate lines for each checkbox,



function requireNumber(field)
{
if(document.forms[0].Attendance1.checked && document.forms[0].attend_fa.checked == false && document.forms[0].attend_tb.checked == false ...)
{
alert ("Choose a checkbox under the I plan to attend section");
return false;
}
return true;
}



how can I put them into an array? (They have to be distinct because of other checkboxes on the page.

So I tried something like this that finds the prefix "attend_" but then I get stuck on what to do:


<script language="JavaScript" type="text/javascript">
var len = document.forms[0].elements.length;
for (var i=0; i<len; i++)
{
var fname = document.forms[0].elements[i].name;
if (fname.length > 8 && ( fname.substring(0,7) == 'attend_')) {
find those related fields and then if they are not checked, popup an alert");
}
}
</script>





<tr valign="top">
<td class="a-body" colspan="3"><input type="radio" name="Attendance1" value="Plan to attend"> I plan to attend, however no payment is required at this time. for the reason stated below. See <a href="">link</a> for additional information.</td>
</tr>
<tr valign="top">
<td class="a-body" width="30%" align="right">&nbsp;</td>
<td width="2"></td>
<td class="a-body"width="70%">
<table border="0" cellpadding="3" cellspacing="2">
<tr valign="top">
<td><input name="fa" type="checkbox" value="I have Financial Aid to cover my term balance"></td>
<td>This certifies that I have Financial Aid<br />
<textarea name="Non pending financial aid" size="80" rows="4"></textarea></td>
</tr>
<tr valign="top">
<td><input name="tb" type="checkbox" value="I have a tuition benefit covering my term balance"></td>
<td>This certifies that I have a tuition benefit covering my term balance. </td>
</tr>
<tr valign="top">
<td><input name="gc" type="checkbox" value="I am on Graduate Contract"></td>
<td>This certifies I am on Graduate Contract. </td>
</tr>
<tr valign="top">
<td><input name="tp" type="checkbox" value="Third party covers the cost of my tuition and fees"></td>
<td>This certifies that third party covers the cost of my tuition and fees</td>
</tr>
</table>
</td>
</tr>


Can someone help?

glenngv
06-27-2007, 09:20 PM
function requireNumber()
{
var frm = document.forms[0];
if (frm.Attendance1.checked && !hasChecked(['fa', 'tb', 'gc', 'tp'], frm))
{
alert("Choose a checkbox under the I plan to attend section");
return false;
}
return true;
}

function hasChecked(arrChk, frm){
for (var i=0; i<arrChk.length; i++){
if (frm.elements[arrChk[i]].checked) return true;
}
return false;
}

finstah1
06-27-2007, 09:28 PM
oh man that is beautiful. Thank you!

I'll give it a go and see what happens

finstah1
06-28-2007, 01:52 PM
Ok I got it to work with my form but when I add the second radio, the form is submitting with validating either radios. The second set is also named Attendance1



<tr valign="top">
<td class="a-body" colspan="3"><input type="radio" name="Attendance2" value="Not attending">
I am <strong>NOT</strong> planning to attend - cancel my registration for the term above.</td>
</tr>
<tr valign="top">
<td class="a-body" width="30%" align="right">&nbsp;</td>
<td width="2"></td>
<td class="a-body"width="70%">
<input name="ha" type="checkbox" value="Cancel my housing assignment">
Cancel my housing assignment <br>
<input name="dp" type="checkbox" value="Cancel my dining plan">
Cancel my dining plan <br></td>
</tr>



so I tried adding to the script.



function reqAttend()
{
var frm = document.forms[0];
if (frm.Attendance1.checked && !hasChecked(['fa', 'tb', 'gc', 'tp'], frm))
{
alert("Choose a checkbox under the I plan to attend section");
return false;
}
else if (frm.Attendance1.checked && !hasChecked(['ha', 'dp'], frm))
{
alert("Choose a checkbox under the I am NOT planning to attend section");
return false;
}
return true;
}
function hasChecked(arrChk, frm)
{
var frm = document.forms[0];
for (var i=0; i<arrChk.length; i++){
if (frm.elements[arrChk[i]].checked) return true;
}
return false;
}


I'd really like to understand what is going on as opposed to just cutting and paste the solution code. The hasChecked function basically loops through the entire form to see what elements are checked correct?

So why does the validation not work when I add the else if statement?

finstah1
06-28-2007, 04:22 PM
I got it to work. Looks like I needed to loop thru the 2 attendance radios to see if they were checked. Thanks again for your help.



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum