I get carpal tunnel just thinking about your form. :eek: Anyway, came up with a more efficient way. Seems to work:
radLimit.max['1'] = 5;
[holds max number for each value, set as described above]
radLimit.n['1'] = 0;
[holds current number for each value, set start value for each, equaling zero]
[if any are default checked, increase value to reflect that]
is_checked
[property of each array of (3) buttons, holds which one is currently checked, so we can decrement it if deselected]
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" />
<html>
<head>
<title>untitled</title>
<script type="text/javascript" language="javascript">
radLimit.max= new Object(); //radLimit.max[radio value] = maximum;
radLimit.max['1'] = 5;
radLimit.max['2'] = 4;
radLimit.max['3'] = 7;
radLimit.n = new Object(); //set ---> radLimit.n[radio value] = 0; <--- for each of the above
radLimit.n['1'] = 0;
radLimit.n['2'] = 0;
radLimit.n['3'] = 0;
function radLimit(oRadio) {
var oForm = oRadio.form, grp = oForm.elements[oRadio.name]; //get array
if (typeof grp.is_checked != 'undefined' && grp.is_checked == oRadio) return; // already checked
++radLimit.n[oRadio.value]; //bump up number checked
if (radLimit.n[oRadio.value] > radLimit.max[oRadio.value]) { //too many?
var sMsg = '\nYou have exceeded the maximum number of these items allowed.\n\n';
sMsg += 'Please select no more than ' + radLimit.max[oRadio.value] + '.\n\nThanks.\n';
alert(sMsg);
--radLimit.n[oRadio.value]; //decrement number checked
if (typeof grp.is_checked != 'undefined') grp.is_checked.checked = true; //re-check previous
return false;
} else {
if (typeof grp.is_checked != 'undefined') --radLimit.n[grp.is_checked.value]; //unchecking, decrement counter
grp.is_checked = oRadio; //for next time, this one currently checked
return true;
}
}
</script>
</head>
<body>
<div align="center">
<h5 style="font-family:monospace;border:1px olive solid;padding:5px;background:ivory;">MAXIMUM RADIOS ALLOWED
<br /><br />item 1 ---> (5) item 2 ---> (4) item 3 ---> (7)</h5>
<form>
<table cellspacing="12" border="1" style="color:white;background:olive">
<tr>
<td>
<input type="radio" name="r1" value="1" onclick="return radLimit(this)" /> item 1<br />
<input type="radio" name="r1" value="2" onclick="return radLimit(this)" /> item 2<br />
<input type="radio" name="r1" value="3" onclick="return radLimit(this)" /> item 3<br />
</td><td>
<input type="radio" name="r2" value="1" onclick="return radLimit(this)" /> item 1<br />
<input type="radio" name="r2" value="2" onclick="return radLimit(this)" /> item 2<br />
<input type="radio" name="r2" value="3" onclick="return radLimit(this)" /> item 3<br />
</td><td>
<input type="radio" name="r3" value="1" onclick="return radLimit(this)" /> item 1<br />
<input type="radio" name="r3" value="2" onclick="return radLimit(this)" /> item 2<br />
<input type="radio" name="r3" value="3" onclick="return radLimit(this)" /> item 3<br />
</td></tr><tr><td>
<input type="radio" name="r4" value="1" onclick="return radLimit(this)" /> item 1<br />
<input type="radio" name="r4" value="2" onclick="return radLimit(this)" /> item 2<br />
<input type="radio" name="r4" value="3" onclick="return radLimit(this)" /> item 3<br />
</td><td>
<input type="radio" name="r5" value="1" onclick="return radLimit(this)" /> item 1<br />
<input type="radio" name="r5" value="2" onclick="return radLimit(this)" /> item 2<br />
<input type="radio" name="r5" value="3" onclick="return radLimit(this)" /> item 3<br />
</td><td>
<input type="radio" name="r6" value="1" onclick="return radLimit(this)" /> item 1<br />
<input type="radio" name="r6" value="2" onclick="return radLimit(this)" /> item 2<br />
<input type="radio" name="r6" value="3" onclick="return radLimit(this)" /> item 3<br />
</td></tr><tr><td>
<input type="radio" name="r7" value="1" onclick="return radLimit(this)" /> item 1<br />
<input type="radio" name="r7" value="2" onclick="return radLimit(this)" /> item 2<br />
<input type="radio" name="r7" value="3" onclick="return radLimit(this)" /> item 3<br />
</td><td>
<input type="radio" name="r8" value="1" onclick="return radLimit(this)" /> item 1<br />
<input type="radio" name="r8" value="2" onclick="return radLimit(this)" /> item 2<br />
<input type="radio" name="r8" value="3" onclick="return radLimit(this)" /> item 3<br />
</td><td>
<input type="radio" name="r9" value="1" onclick="return radLimit(this)" /> item 1<br />
<input type="radio" name="r9" value="2" onclick="return radLimit(this)" /> item 2<br />
<input type="radio" name="r9" value="3" onclick="return radLimit(this)" /> item 3
</td></tr><tr><td colspan="3" align="center">
<br /><input type="reset" />
</td></tr></table>
</form>
</div>
</body>
</html>