Check all form checkboxes funtion ??

E

Edward

The following html / javascript code produces a simple form with check
boxes. There is also a checkbox that 'checks all' form checkboxes
hotmail style:

<html>
<head>
<title></title>
</head>
<body>
<form name="myform" action=test.php method=post>
<script language="JavaScript">
<!--

var row_1 = new Array("Monday0", "Monday4")

function check_boxes1(state) { for (y=0; y < row_1.length; y++) {
for (i = 0; i < document.myform.elements.length; i++) {

if (document.myform.elements.name == row_1)
document.myform.elements.checked = state; }; }}
-->
</script>

<table><tr>
<td><input type=checkbox name=Monday0>Monday0</td>
<td><input type=checkbox name=Monday4>Monday4</td>
<td><input type="checkbox" name="checkall_row1"
onClick="check_boxes1(true)">toggle</td></tr>
<td><input type=submit value=submit class=button1></td>
</form>
</body>
</html>

I have no experience with javascript but assumed the below code would
allow me to create a similar form. This new form comprises of two rows
of check boxes with a row specific 'check all' checkbox at the end of
each row.


<html>
<head>
<title></title>
</head>
<body>
<form name="myform" action=test.php method=post>
<script language="JavaScript">
<!--

var row_1 = new Array("Monday0", "Monday4")

function check_boxes1(state) { for (y=0; y < row_1.length; y++) {
for (i = 0; i < document.myform.elements.length; i++) { if
(document.myform.elements.name == row_1)
document.myform.elements.checked = state; }; }}


var row_2 = new Array("Monday1", "Monday5")

function check_boxes2(state) { for (y=0; y < row_2.length; y++) {
for (i = 0; i < document.myform.elements.length; i++) { if
(document.myform.elements.name == row_2)
document.myform.elements.checked = state; }; }}

-->
</script>


<table>
<tr>
<td><input type=checkbox name=Monday0>Monday0</td>
<td><input type=checkbox name=Monday4>Monday4</td>
<td><input type="checkbox" name="checkall_row1"
onClick="check_boxes1(true)">toggle</td>
</tr><tr>
<td><input type=checkbox name=Monday1>Monday1</td>
<td><input type=checkbox name=Monday5>Monday5</td>
<td><input type="checkbox" name="checkall_row2"
onClick="check_boxes2(true)">toggle</td></tr>
<td><input type=submit value=submit class=button1></td>
</form>
</body>
</html>


Selecting row 1's 'check all' checks all check boxes in row 1
Selecting row 2's 'check all' doesn't check all check boxes in row 2.

Can anyone help me fix this?

Ta,

Ed
 
L

lallous

Hello,

Replace in the two functions:
if (document.myform.elements.name == row_1)

with:
if (document.myform.elements.name == row_1[y])

And
if (document.myform.elements.name == row_2)

with:
if (document.myform.elements.name == row_2[y])

Guess you had a logic error in your for loop.

--
Elias
Edward said:
The following html / javascript code produces a simple form with check
boxes. There is also a checkbox that 'checks all' form checkboxes
hotmail style:

<html>
<head>
<title></title>
</head>
<body>
<form name="myform" action=test.php method=post>
<script language="JavaScript">
<!--

var row_1 = new Array("Monday0", "Monday4")

function check_boxes1(state) { for (y=0; y < row_1.length; y++) {
for (i = 0; i < document.myform.elements.length; i++) {

if (document.myform.elements.name == row_1)
document.myform.elements.checked = state; }; }}
-->
</script>

<table><tr>
<td><input type=checkbox name=Monday0>Monday0</td>
<td><input type=checkbox name=Monday4>Monday4</td>
<td><input type="checkbox" name="checkall_row1"
onClick="check_boxes1(true)">toggle</td></tr>
<td><input type=submit value=submit class=button1></td>
</form>
</body>
</html>

I have no experience with javascript but assumed the below code would
allow me to create a similar form. This new form comprises of two rows
of check boxes with a row specific 'check all' checkbox at the end of
each row.


<html>
<head>
<title></title>
</head>
<body>
<form name="myform" action=test.php method=post>
<script language="JavaScript">
<!--

var row_1 = new Array("Monday0", "Monday4")

function check_boxes1(state) { for (y=0; y < row_1.length; y++) {
for (i = 0; i < document.myform.elements.length; i++) { if
(document.myform.elements.name == row_1)
document.myform.elements.checked = state; }; }}


var row_2 = new Array("Monday1", "Monday5")

function check_boxes2(state) { for (y=0; y < row_2.length; y++) {
for (i = 0; i < document.myform.elements.length; i++) { if
(document.myform.elements.name == row_2)
document.myform.elements.checked = state; }; }}

-->
</script>


<table>
<tr>
<td><input type=checkbox name=Monday0>Monday0</td>
<td><input type=checkbox name=Monday4>Monday4</td>
<td><input type="checkbox" name="checkall_row1"
onClick="check_boxes1(true)">toggle</td>
</tr><tr>
<td><input type=checkbox name=Monday1>Monday1</td>
<td><input type=checkbox name=Monday5>Monday5</td>
<td><input type="checkbox" name="checkall_row2"
onClick="check_boxes2(true)">toggle</td></tr>
<td><input type=submit value=submit class=button1></td>
</form>
</body>
</html>


Selecting row 1's 'check all' checks all check boxes in row 1
Selecting row 2's 'check all' doesn't check all check boxes in row 2.

Can anyone help me fix this?

Ta,

Ed
 
@

@SM

Edward a ecrit :
There is also a checkbox that 'checks all' form checkboxes

<form name="myform" action=test.php method=post>

<script language="JavaScript">
<!--

var row_1 = new Array("Monday0", "Monday4")

function check_boxes1(state) { for (y=0; y < row_1.length; y++) {
for (i = 0; i < document.myform.elements.length; i++) { if
(document.myform.elements.name == row_1)
document.myform.elements.checked = state; }; }}

var row_2 = new Array("Monday1", "Monday5")

function check_boxes2(state) { for (y=0; y < row_2.length; y++) {
for (i = 0; i < document.myform.elements.length; i++) { if
(document.myform.elements.name == row_2)
document.myform.elements.checked = state; }; }}

-->
</script>

<table>
<tr>
<td><input type=checkbox name=Monday0>Monday0</td>
<td><input type=checkbox name=Monday4>Monday4</td>
<td><input type="checkbox" name="checkall_row1"
onClick="check_boxes1(true)">toggle</td>
</tr><tr>
<td><input type=checkbox name=Monday1>Monday1</td>
<td><input type=checkbox name=Monday5>Monday5</td>
<td><input type="checkbox" name="checkall_row2"
onClick="check_boxes2(true)">toggle</td></tr>
<td><input type=submit value=submit class=button1></td>


</form>

Selecting row 1's 'check all' checks all check boxes in row 1
Selecting row 2's 'check all' doesn't check all check boxes in row 2.

it is only because when the function arrives on 2nd row
i = 3
but the 1st checkbox of this row is row_2[0]
i would be '0' .... and ... y has the correct value ! :-(
so :

function check_boxes2(state) {
for (y=0; y < row_2.length; y++)
for (i = 0; i < document.myform.elements.length; i++)
if(document.myform.elements.name == row_2[y]) // here the error
document.myform.elements.checked = state;
}
Can anyone help me fix this?

correct your 1st function like the new 2nd


--
**************************************************************
Stéphane MORIAUX : mailto:[email protected]
Aide aux Pages Perso (images & couleurs, formulaire, CHP, JS)
http://perso.wanadoo.fr/stephanePOINTmoriaux/internet/
**************************************************************
 

Ask a Question

Want to reply to this thread or ask your own question?

You'll need to choose a username for the site, which only take a couple of moments. After that, you can post your question and our members will help you out.

Ask a Question

Members online

Forum statistics

Threads
473,767
Messages
2,569,570
Members
45,045
Latest member
DRCM

Latest Threads

Top