We help IT Professionals succeed at work.

Check all checkboxes ... not working perfectly

Abiel de Groot
on
The below code works ... but not all that well. If no checkboxes are checked it will check them all. However, if at least one is checked it will not check the others.

<!-- Begin
function isChecked(chks)
{
      var rval = false;
      for(var i=0; i<chks.length; i++)
      {
            if(chks[i].checked)
            {
                  rval = true;
                  break;
            }
      }
      return rval;
}

function SelAll(field){
if (!isChecked(document.formPageEditor["Chk_IncYr"]))
{
		for (i = 0; i < field.length; i++)
		field[i].checked = true ;
		
		
}
document.getElementById("AllChecked").checked = true;
}
//  End -->

Open in new window



Any ideas?
Comment
Watch Question

Top Expert 2013

Commented:
I think you need an opening brace here:

for (i = 0; i < field.length; i++) {


Cd&
Can you include any of the checkbox HTML as an example and perhaps the HTML for the checkbox used to check all the checkboxes.

Going on what you've posted so far though, the isChecked function returns true as soon as it finds one of the checkboxes (in document.formPageEditor["Chk_IncYr"]) is checked, in the SellAll function it only goes through all the checkboxes (in field) and checks them if isChecked returns false. So therefore if any checkbox is checked it will never check all the checkboxes. But I can't imagine what's in field or document.formPageEditor["Chk_IncYr"] without the HTML.
SILVER EXPERT
Most Valuable Expert 2017
Distinguished Expert 2019

Commented:
That is correct - but what do you want it to do?
function SelAll(field){
// if none are checked then proceed and set the others.
// if one is checked isChecked returns true so the for loop
// won't run
if (!isChecked(document.formPageEditor["Chk_IncYr"]))
{
		for (i = 0; i < field.length; i++)
		field[i].checked = true ;
		
		
}

Open in new window

Abiel de GrootAbiel de Groot (Jonbysoft)

Author

Commented:
The HTML just lists the options. The checkboxes are dynamically generated and look like this

<input name="Chk_IncYr" type="checkbox" id="Chk_IncYr1" value="1" />
<input name="Chk_IncYr" type="checkbox" id="Chk_IncYr1" value="2" />
<input name="Chk_IncYr" type="checkbox" id="Chk_IncYr1" value="3" />


Obviously they have labels ..

The call looks like this.

A:
Abiel de GrootAbiel de Groot (Jonbysoft)

Author

Commented:
PS. The ID's are unique on all ...
SILVER EXPERT
Most Valuable Expert 2017
Distinguished Expert 2019

Commented:
Ok but what is the behaviour you want ?
Right, I'm not sure why you are checking to see if any are currently checked when the SelAll function is called. How about...

function SelAll(field) {
	// Get the current state of the AllChecked checkbox.
	var allChecked = document.getElementById("AllChecked").checked;
	// Set all checkboxes to the same state as the AllChecked checkbox.
	for (i=0; i<field.length; i++)
		field[i].checked = allChecked;
}

Open in new window


Then just call SelAll when the state of the AllChecked checkbox is changed (if that's what the AllChecked checkbox is for, I'm only assuming here). As far as I can tell there is no need to check the current state of the checkboxes. But if you check the AllChecked checkbox then all boxes will become checked and if you uncheck it they will all become unchecked.
Abiel de GrootAbiel de Groot (Jonbysoft)

Author

Commented:
Many thanks

Explore More ContentExplore courses, solutions, and other research materials related to this topic.