faqts : Computers : Programming : Languages : JavaScript

+ Search
Add Entry AlertManage Folder Edit Entry Add page to http://del.icio.us/
Did You Find This Entry Useful?

2 of 3 people (67%) answered Yes
Recently 2 of 3 people (67%) answered Yes

Entry

i want to functionality of check all check box like that of yahoo mail were we can ckh all box

Apr 8th, 2008 18:14
ha mo, Polo Herrera, nitin kale,


I will list a general approach. As I don't know what is on the web 
page I will assume the following:
There are other items on the page other than just check boxes
The first check box will manipulte the behavior of ALL other check 
boxes
This method does not take into account checkbox names
If the other boxes were checked or unchecked, they will be set to the 
control check boxes state.
There are many ways to accomplish this. This method will reads through 
all elements of the form. Based on the first checkbox it finds, it 
will set all other check boxes to that same state. 
function checkboxes(theForm)
{
var num_of_elements = theForm.length;//how many times to loop
var all_checkboxes;//used to set the state of all other boxes
var first_checkbox = -1;//use is for "if" statements to know it is not
                        //the first box. I used -1 because it can't be
                        //a value of "i" in the loop. Any number other
                        //than 0 to num_of_elements would work. But
                        //num_of_elements is unknown, so a negative
                        //was a safe choice.
for (var i=0; i<num_of_elements; i++)//loop through all elements in 
form
	{
	var theElement = theForm.elements[i];\\saves some typing later
	var element_type = theElement.type;\\use in "if" statements
	if (element_type == "checkbox" && first_checkbox == -1)//true 
only for first checkbox
		{
		first_checkbox = i;//used for later "if" statements
		if (theElement.checked == true)
			all_checkboxes = true
		else
			all_checkboxes = false
		}
	else if (element_type == "checkbox" && first_checkbox != -
1)//true for all BUT first checkbox
		theElement.checked = all_checkboxes//set to control 
checkbox state
	}
}
to implement, simply add to your first checkbox
onclick="checkboxes(this.form)"
A nice one page reference that also could help is at
http://www5.brinkster.com/hiflyer/jscript/formchecktest.htm
I modified this code to fit your needs. From that page you should be 
able to get other ideas about form control and checking values of form 
elements.
http://www.businessian.com
http://www.computerstan.com
http://www.financestan.com
http://www.healthstan.com
http://www.internetstan.com
http://www.moneyenews.com
http://www.technologystan.com
http://www.zobab.com
http://www.healthinhealth.com