HowToJavaScript_Check_Uncheck_All_CheckBox_Another

[Home] [Edit this page] [Recent Changes] [Special Pages] [Help]

HowToJavaScript_Check_Uncheck_All_CheckBox_Another_Form

How to select or deselect the same checkboxes on two forms?

The example shows how to check or uncheck the checkboxes in one form so that the checkboxes with the same index in another form will also be checked or unchecked.

<html>
<head>
<script> 
function CheckAll()
{
count = document.form1.elements.length;
    for (i=0; i < count; i++) 
	{
    if(document.form1.elements[i].checked == 1)
    	{document.form2.elements[i].checked = 1; }
    else {document.form2.elements[i].checked = 0;}
	}
}
</script>
</head>
<body>
<form name="form1">Form 1
<input type="checkbox" onclick="CheckAll()" />
<input type="checkbox" onclick="CheckAll()" />
<input type="checkbox" onclick="CheckAll()" />
<input type="checkbox" onclick="CheckAll()" />
<input type="checkbox" onclick="CheckAll()" /> 
</form>
<form name="form2">Form 2
<input type="checkbox" />
<input type="checkbox" />
<input type="checkbox" />
<input type="checkbox" />
<input type="checkbox" />
</form> 
</body>
</html>

The count variable will hold the value of the checkboxes' index number in the first form form1. Each iteration will increase the index number with one. Indexes start from zero.

<form name="form1">Form 1
<input type="checkbox" /> this item will have [i] = 0
<input type="checkbox" /> this item will have [i] = 1
<input type="checkbox" /> this item will have [i] = 2
<input type="checkbox" /> this item will have [i] = 3
<input type="checkbox" /> this item will have [i] = 4 
</form>

The function then checks if the checkboxes in the first form are checked or not. If they are, then it will check the checkboxes with the same index number on the second form.

Related threads:
Copy checkboxes' value

JavaScript FAQ

last edited (April 19, 2004) by lillu, Number of views: 2063, Current Rev: 5 (Diff)

[Edit this page] [Page history] [What links here] [Discuss this topic] [Printer Friendly]