Forum Moderators: open
I'm wanting to do the classic "click here to select all checkboxes".
I'm no JavaScript expert but I've tried to alter some code I found in order to select/unselect all the markers (items running down the left hand side) and individuals (items running across the top), by way of a radio button for each.
I'm somewhat confused as to why the following code only works to checking/unchecking the top row of my checkboxes ie the markers buttons do not work.
If I simplify the page (ie remove any trace of the individuals) the markers buttons begin to function once more.
Any ideas why?
Here's the code - it's probably better to view it in a browser to get the idea.
Many huge amounts of thanks in advance to anyone who can help.
Cheers,
Camman
<html>
<head>
<title>DM2</title>
<script language=JavaScript>
function doCheckAllmark(n)
{
with (document.ped) {
var mark = 0;
for (var i=0; i < elements.length; i++) {
if (elements[i].type == 'checkbox' && elements[i].name == "marker" + mark)
elements[i].checked = eval(n);
mark++;
}
}
}
function doCheckAllindivid(m)
{
with (document.ped) {
var indiv = 0;
for (var i=0; i < elements.length; i++) {
if (elements[i].type == 'checkbox' && elements[i].name == "indiv" + indiv)
elements[i].checked = eval(m);
indiv++;
}
}
}
</SCRIPT>
</head>
<body>
<div align="left">
<form name="ped" method="post" action="/cgi-bin/pedfile.cgi" target="_blank">
<table border="1">
<tr><td></td>
<td>natal_nat_111_496<br><input type="checkbox" name="indiv0" value="natal_nat_111_496"></td><td>natal_nat_111_501<br><input type="checkbox" name="indiv1" value="natal_nat_111_501"></td><td>natal_nat_111_490<br><input type="checkbox" name="indiv2" value="natal_nat_111_490"></td><td>natal_nat_111_494<br><input type="checkbox" name="indiv3" value="natal_nat_111_494"></td><td>natal_nat_111_495<br><input type="checkbox" name="indiv4" value="natal_nat_111_495"></td><td>natal_nat_111_497<br><input type="checkbox" name="indiv5" value="natal_nat_111_497"></td>
</tr><tr><td>D17S1299<br><input type="checkbox" name="marker0" value="D17S1299"></td><td> </td><td> </td><td> </td><td> </td><td> </td><td> </td>
</tr><tr><td>D17S1785<br><input type="checkbox" name="marker1" value="D17S1785"></td><td> </td><td> </td><td> </td><td> </td><td> </td><td> </td>
</tr><tr><td>D17S1814<br><input type="checkbox" name="marker2" value="D17S1814"></td><td> </td><td> </td><td> </td><td> </td><td> </td><td> </td>
</tr><tr><td>D17S1824<br><input type="checkbox" name="marker3" value="D17S1824"></td><td> </td><td> </td><td> </td><td> </td><td> </td><td> </td>
</tr><tr>
<td colspan=2>
<input type="radio" name="markerSelect" onclick="doCheckAllmark(true)">Check ALL markers<br>
<input type="radio" name="markerSelect" onclick="doCheckAllmark(false)">Uncheck ALL markers<br>
<input type="radio" name="individSelect" onclick="doCheckAllindivid(true)">Check ALL individuals<br>
<input type="radio" name="individSelect" onclick="doCheckAllindivid(false)">Uncheck ALL individuals<br>
</td></tr>
</table>
</form>
</div>
</body>
</html>
function doCheckAllmark(n)
{
with (document.ped) {
var mark = 0;
for (var i=0; i < elements.length; i++) {
if (elements[i].type == 'checkbox' && elements[i].name == "marker" + mark)){
elements[i].checked = eval(n);
mark++;
}
}
}
}
function doCheckAllindivid(m)
{
with (document.ped) {
var indiv = 0;
for (var i=0; i < elements.length; i++) {
if (elements[i].type == 'checkbox' && elements[i].name == "indiv" + indiv){
elements[i].checked = eval(m);
indiv++;
}
}
}
}
Thanks very much Korkus.
Camman
