Q1118 How can I check several checkboxes on a page when I select one checkbox that says "Select all"?

irt.org | Knowledge Base | JavaScript | Form 10.1 | Q1118 [ previous next ]

Q1118 How can I check several checkboxes on a page when I select one checkbox that says "Select all"?

Try:

<input type="checkbox"
onClick="if (this.checked) { document.myform.chk1.checked=true; document.myform.chk2.checked=true; document.myform.chk3.checked=true;}">

Or with a routine - just give the checkboxes a name starting wiht something recognisable, like chk_:

<script language="JavaScript"><!--
function checkAll(theForm) {
    for (i=0,n=theForm.elements.length;i<n;i++)
        if (theForm.elements[i].name.indexOf('chk__') !=-1)
            theForm.elements[i].checked = true;
}
//--></script>

The following was submitted by Brian Bloom

Here's a version of the code that will set (or unset) all the checkboxes in a form, regardless of name. It also uses a single function to handle both "check all" and "uncheck all"

<script language="JavaScript"><!--
function setAllCheckboxes(theForm,strToggle) {
  var blnToggle = (strToggle=='on')				
  for (i=0,n=theForm.elements.length;i<n;i++) {
    if (theForm.elements[i].type == "checkbox" ) {
      theForm.elements[i].checked = blnToggle;
    }
  }
}
//--></script>

<input type="button" Value="Check all"  onClick="setAllCheckboxes(this.form, 'on')">
<input type="button" Value="Uncheck all" onClick="setAllCheckboxes(this.form, 'off')">

Feedback on 'Q1118 How can I check several checkboxes on a page when I select one checkbox that says "Select all"?'

What's New

How to do the impossible with Google Gears

Out and About

Last Updated: 30th March 2008. Maintained by: Martin Webb and Michel Plungjan
irt.org liability, trademark, document use, privacy statement and software licensing rules apply.