E
Edward
The below code builds 2 tables 4 rows by 4 cols. All cells have
checkboxes. When checked, the checkboxes in the first column
automatically check the remainder of the check boxes in the same row.
This is working fine for tables of this size. Unfortunately, my app
produces lots of considerably bigger tables and the 'toggle' can take
over a minute to complete!!
I assume this is because for each toggle, the all form elements are
searched through to see if they match.
Is it possible to change this so that a toggle only has to search the
elements of the table it appears in - rather than the whole form?
A document.table_id DOM object would seem to be the answer, but I can
find a reference to a table object.
Your assistance is appreciated!
Edward
CODE:
<form name=taskform action=check_submit.php method=post>
<script language="JavaScript"> <!--
var row_1Monday = new Array("Monday0", "Monday4", "Monday8")
function check_boxes1Monday() {var state = false;if
(document.taskform.checkall_row1Monday.checked) state = true; for
(y=0; y < row_1Monday.length; y++) { for (i = 0; i <
document.taskform.elements.length; i++) { if
(document.taskform.elements.name == row_1Monday[y])
document.taskform.elements.checked = state; }; }}
var row_2Monday = new Array("Monday1", "Monday5", "Monday9")
function check_boxes2Monday() {var state = false;if
(document.taskform.checkall_row2Monday.checked) state = true; for
(y=0; y < row_2Monday.length; y++) { for (i = 0; i <
document.taskform.elements.length; i++) { if
(document.taskform.elements.name == row_2Monday[y])
document.taskform.elements.checked = state; }; }}
var row_3Monday = new Array("Monday2", "Monday6", "Monday10")
function check_boxes3Monday() {var state = false;if
(document.taskform.checkall_row3Monday.checked) state = true; for
(y=0; y < row_3Monday.length; y++) { for (i = 0; i <
document.taskform.elements.length; i++) { if
(document.taskform.elements.name == row_3Monday[y])
document.taskform.elements.checked = state; }; }}
var row_4Monday = new Array("Monday3", "Monday7", "Monday11")
function check_boxes4Monday() {var state = false;if
(document.taskform.checkall_row4Monday.checked) state = true; for
(y=0; y < row_4Monday.length; y++) { for (i = 0; i <
document.taskform.elements.length; i++) { if
(document.taskform.elements.name == row_4Monday[y])
document.taskform.elements.checked = state; }; }}
--> </script>
<table border=1>
<tr><caption>Monday</caption></tr>
<tr><td>toggle</td><td>0</td><td>1</td><td l>2</td></tr>
<tr><td><input type=checkbox name="checkall_row1Monday"
onClick="check_boxes1Monday(true)"></td>
<td><input type=checkbox name=Monday0></td><td><input type=checkbox
name=Monday4></td>
<td><input type=checkbox name=Monday8></td></tr>
<tr><td><input type=checkbox name="checkall_row2Monday"
onClick="check_boxes2Monday(true)"></td>
<td><input type=checkbox name=Monday1></td><td><input type=checkbox
name=Monday5></td>
<td><input type=checkbox name=Monday9></td></tr>
<tr><td><input type=checkbox name="checkall_row3Monday"
onClick="check_boxes3Monday(true)"></td>
<td><input type=checkbox name=Monday2></td><td><input type=checkbox
name=Monday6></td>
<td><input type=checkbox name=Monday10></td></tr>
<tr><td><input type=checkbox name="checkall_row4Monday"
onClick="check_boxes4Monday(true)"></td>
<td><input type=checkbox name=Monday3></td><td><input type=checkbox
name=Monday7></td>
<td><input type=checkbox name=Monday11></td></tr>
</table>
<script language="JavaScript"> <!--
var row_1Tuesday = new Array("Tuesday0", "Tuesday4", "Tuesday8")
function check_boxes1Tuesday() {var state = false;if
(document.taskform.checkall_row1Tuesday.checked) state = true; for
(y=0; y < row_1Tuesday.length; y++) { for (i = 0; i <
document.taskform.elements.length; i++) { if
(document.taskform.elements.name == row_1Tuesday[y])
document.taskform.elements.checked = state; }; }}
var row_2Tuesday = new Array("Tuesday1", "Tuesday5", "Tuesday9")
function check_boxes2Tuesday() {var state = false;if
(document.taskform.checkall_row2Tuesday.checked) state = true; for
(y=0; y < row_2Tuesday.length; y++) { for (i = 0; i <
document.taskform.elements.length; i++) { if
(document.taskform.elements.name == row_2Tuesday[y])
document.taskform.elements.checked = state; }; }}
var row_3Tuesday = new Array("Tuesday2", "Tuesday6", "Tuesday10")
function check_boxes3Tuesday() {var state = false;if
(document.taskform.checkall_row3Tuesday.checked) state = true; for
(y=0; y < row_3Tuesday.length; y++) { for (i = 0; i <
document.taskform.elements.length; i++) { if
(document.taskform.elements.name == row_3Tuesday[y])
document.taskform.elements.checked = state; }; }}
var row_4Tuesday = new Array("Tuesday3", "Tuesday7", "Tuesday11")
function check_boxes4Tuesday() {var state = false;if
(document.taskform.checkall_row4Tuesday.checked) state = true; for
(y=0; y < row_4Tuesday.length; y++) { for (i = 0; i <
document.taskform.elements.length; i++) { if
(document.taskform.elements.name == row_4Tuesday[y])
document.taskform.elements.checked = state; }; }}
--> </script>
<table border=1>
<tr><caption>Tuesday</caption></tr>
<tr><td>toggle</td><td>0</td><td>1</td><td l>2</td></tr>
<tr><td><input type=checkbox name="checkall_row1Tuesday"
onClick="check_boxes1Tuesday(true)"></td>
<td><input type=checkbox name=Tuesday0></td><td><input type=checkbox
name=Tuesday4></td>
<td><input type=checkbox name=Tuesday8></td></tr>
<tr><td><input type=checkbox name="checkall_row2Tuesday"
onClick="check_boxes2Tuesday(true)"></td>
<td><input type=checkbox name=Tuesday1></td><td><input type=checkbox
name=Tuesday5></td>
<td><input type=checkbox name=Tuesday9></td></tr>
<tr><td><input type=checkbox name="checkall_row3Tuesday"
onClick="check_boxes3Tuesday(true)"></td>
<td><input type=checkbox name=Tuesday2></td><td><input type=checkbox
name=Tuesday6></td>
<td><input type=checkbox name=Tuesday10></td></tr>
<tr><td><input type=checkbox name="checkall_row4Tuesday"
onClick="check_boxes4Tuesday(true)"></td>
<td><input type=checkbox name=Tuesday3></td><td><input type=checkbox
name=Tuesday7></td>
<td><input type=checkbox name=Tuesday11></td></tr>
</table>
</form>
checkboxes. When checked, the checkboxes in the first column
automatically check the remainder of the check boxes in the same row.
This is working fine for tables of this size. Unfortunately, my app
produces lots of considerably bigger tables and the 'toggle' can take
over a minute to complete!!
I assume this is because for each toggle, the all form elements are
searched through to see if they match.
Is it possible to change this so that a toggle only has to search the
elements of the table it appears in - rather than the whole form?
A document.table_id DOM object would seem to be the answer, but I can
find a reference to a table object.
Your assistance is appreciated!
Edward
CODE:
<form name=taskform action=check_submit.php method=post>
<script language="JavaScript"> <!--
var row_1Monday = new Array("Monday0", "Monday4", "Monday8")
function check_boxes1Monday() {var state = false;if
(document.taskform.checkall_row1Monday.checked) state = true; for
(y=0; y < row_1Monday.length; y++) { for (i = 0; i <
document.taskform.elements.length; i++) { if
(document.taskform.elements.name == row_1Monday[y])
document.taskform.elements.checked = state; }; }}
var row_2Monday = new Array("Monday1", "Monday5", "Monday9")
function check_boxes2Monday() {var state = false;if
(document.taskform.checkall_row2Monday.checked) state = true; for
(y=0; y < row_2Monday.length; y++) { for (i = 0; i <
document.taskform.elements.length; i++) { if
(document.taskform.elements.name == row_2Monday[y])
document.taskform.elements.checked = state; }; }}
var row_3Monday = new Array("Monday2", "Monday6", "Monday10")
function check_boxes3Monday() {var state = false;if
(document.taskform.checkall_row3Monday.checked) state = true; for
(y=0; y < row_3Monday.length; y++) { for (i = 0; i <
document.taskform.elements.length; i++) { if
(document.taskform.elements.name == row_3Monday[y])
document.taskform.elements.checked = state; }; }}
var row_4Monday = new Array("Monday3", "Monday7", "Monday11")
function check_boxes4Monday() {var state = false;if
(document.taskform.checkall_row4Monday.checked) state = true; for
(y=0; y < row_4Monday.length; y++) { for (i = 0; i <
document.taskform.elements.length; i++) { if
(document.taskform.elements.name == row_4Monday[y])
document.taskform.elements.checked = state; }; }}
--> </script>
<table border=1>
<tr><caption>Monday</caption></tr>
<tr><td>toggle</td><td>0</td><td>1</td><td l>2</td></tr>
<tr><td><input type=checkbox name="checkall_row1Monday"
onClick="check_boxes1Monday(true)"></td>
<td><input type=checkbox name=Monday0></td><td><input type=checkbox
name=Monday4></td>
<td><input type=checkbox name=Monday8></td></tr>
<tr><td><input type=checkbox name="checkall_row2Monday"
onClick="check_boxes2Monday(true)"></td>
<td><input type=checkbox name=Monday1></td><td><input type=checkbox
name=Monday5></td>
<td><input type=checkbox name=Monday9></td></tr>
<tr><td><input type=checkbox name="checkall_row3Monday"
onClick="check_boxes3Monday(true)"></td>
<td><input type=checkbox name=Monday2></td><td><input type=checkbox
name=Monday6></td>
<td><input type=checkbox name=Monday10></td></tr>
<tr><td><input type=checkbox name="checkall_row4Monday"
onClick="check_boxes4Monday(true)"></td>
<td><input type=checkbox name=Monday3></td><td><input type=checkbox
name=Monday7></td>
<td><input type=checkbox name=Monday11></td></tr>
</table>
<script language="JavaScript"> <!--
var row_1Tuesday = new Array("Tuesday0", "Tuesday4", "Tuesday8")
function check_boxes1Tuesday() {var state = false;if
(document.taskform.checkall_row1Tuesday.checked) state = true; for
(y=0; y < row_1Tuesday.length; y++) { for (i = 0; i <
document.taskform.elements.length; i++) { if
(document.taskform.elements.name == row_1Tuesday[y])
document.taskform.elements.checked = state; }; }}
var row_2Tuesday = new Array("Tuesday1", "Tuesday5", "Tuesday9")
function check_boxes2Tuesday() {var state = false;if
(document.taskform.checkall_row2Tuesday.checked) state = true; for
(y=0; y < row_2Tuesday.length; y++) { for (i = 0; i <
document.taskform.elements.length; i++) { if
(document.taskform.elements.name == row_2Tuesday[y])
document.taskform.elements.checked = state; }; }}
var row_3Tuesday = new Array("Tuesday2", "Tuesday6", "Tuesday10")
function check_boxes3Tuesday() {var state = false;if
(document.taskform.checkall_row3Tuesday.checked) state = true; for
(y=0; y < row_3Tuesday.length; y++) { for (i = 0; i <
document.taskform.elements.length; i++) { if
(document.taskform.elements.name == row_3Tuesday[y])
document.taskform.elements.checked = state; }; }}
var row_4Tuesday = new Array("Tuesday3", "Tuesday7", "Tuesday11")
function check_boxes4Tuesday() {var state = false;if
(document.taskform.checkall_row4Tuesday.checked) state = true; for
(y=0; y < row_4Tuesday.length; y++) { for (i = 0; i <
document.taskform.elements.length; i++) { if
(document.taskform.elements.name == row_4Tuesday[y])
document.taskform.elements.checked = state; }; }}
--> </script>
<table border=1>
<tr><caption>Tuesday</caption></tr>
<tr><td>toggle</td><td>0</td><td>1</td><td l>2</td></tr>
<tr><td><input type=checkbox name="checkall_row1Tuesday"
onClick="check_boxes1Tuesday(true)"></td>
<td><input type=checkbox name=Tuesday0></td><td><input type=checkbox
name=Tuesday4></td>
<td><input type=checkbox name=Tuesday8></td></tr>
<tr><td><input type=checkbox name="checkall_row2Tuesday"
onClick="check_boxes2Tuesday(true)"></td>
<td><input type=checkbox name=Tuesday1></td><td><input type=checkbox
name=Tuesday5></td>
<td><input type=checkbox name=Tuesday9></td></tr>
<tr><td><input type=checkbox name="checkall_row3Tuesday"
onClick="check_boxes3Tuesday(true)"></td>
<td><input type=checkbox name=Tuesday2></td><td><input type=checkbox
name=Tuesday6></td>
<td><input type=checkbox name=Tuesday10></td></tr>
<tr><td><input type=checkbox name="checkall_row4Tuesday"
onClick="check_boxes4Tuesday(true)"></td>
<td><input type=checkbox name=Tuesday3></td><td><input type=checkbox
name=Tuesday7></td>
<td><input type=checkbox name=Tuesday11></td></tr>
</table>
</form>