Question

I have a little problem. I think I make a big noob mistake but I can’t find it. In the following code I try to get input of my form, but it gets input outside of form too. Why is that ?

Here my JS code :

function selectAll(bool){
    var form = document.forms['selectMailing'];
    for(var i=1; i<=form.length; i++) {
        form.elements['select'+i].checked = bool;
    }
}

And HTML :

<input type=button value="Select All" onclick="selectAll(true)"/>
<form method=post action="" id="selectMailing" onsubmit="return checkSelect()">
    <input type=checkbox name="select1" value="1" />
    <input type=checkbox name="select2" value="1" />
    <input type=submit value="Spammer" />
</form>

So when i try this, JS return error ‘Cannot set property ‘checked’ of undefined’ on line where there is my input button. Why this stuff happens ? I select form and only his elements and input button has no name which can be confused with the name form.

Thanks for your help !

I know about jquery but I want to learn JavaScript before, so if your only anwser is ‘use jQuery’, please go help someone else 🙂

Answer 1

In your form ‘selectMailing’ there are 3 inputs. You can verify it by giving an alert for ‘form.length’ in code. First two inputs are of type checkbox and 3rd one is of type submit.

modify javascript like this for accesing checkbox type input items(uses type checking)

function selectAll(bool){
var form = document.forms['selectMailing'];
//alert(form.length);
for(var i=0; i<form.length; i++){
     if(form.elements[i].type == "checkbox")
     {
          form.elements[i].checked = bool;
      }
  }
}