Question

html code:

<div>

        <input type="checkbox" onclick="selectAll(this);" />select all<br/>
        <input type="checkbox"  /><br/>
        <input type="checkbox"  /><br/>
        <input type="checkbox"  /><br/>
        <input type="checkbox"  /><br/>
        <input type="checkbox"  /><br/>
        <input type="checkbox"  /><br/>
</div>

jquery code:

    $(document).ready(function(){
  function selectAll(checkbox){
    alert("test");
    $("input[type=checkbox]").attr('checked',$(checkbox).attr('checked'));
    }
    });

why the select and unselect all doesn’t work. when i put the alert statement to test what’s wrong with the code. the alert also doesn’t work.

i want to know why my code doesn’t work?

Answer 1

Your code doesn’t make much sense. What you’re currently doing is passing an event handler to the ready method that checks all the inputs on document ready. And this will happen only if you fix the typo.

What you need is something like this : http://jsfiddle.net/NJuqm/

//Should be inside $(document).ready()
$('#sel_all').click(function(){
    if (this.checked) {
        $('input:checkbox').attr('checked', 'checked');
    } else {
        $('input:checkbox').removeAttr('checked');
    }
});

    <input type="checkbox" id='sel_all'/>select all<br/>
    <input type="checkbox"  /><br/>
    <input type="checkbox"  /><br/>
    <input type="checkbox"  /><br/>
    <input type="checkbox"  /><br/>
    <input type="checkbox"  /><br/>
    <input type="checkbox"  /><br/>