CODEWITHSUNDEEP
jquery
runeveryday
runeveryday

Reputation: 2799

why the checkall code doesn't work?

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?

Upvotes: 1

Views: 135

Answers (4)

Greg B
Greg B

Reputation: 14898

$(document).ready fires when the document has loaded. It is not a named function.

Your HTML assumes there is a function named selectAll.

try swapping your $(document).ready with the following.

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

UPDATE

Defining a function does not execute the function. So the definition does not need to be inside your $(document).ready. It will only be called when the first checkbox is clicked.

Upvotes: 1

Monday
Monday

Reputation: 1413

Easiest “check all” ever with jQuery

HTML:

<div>
        <input type="checkbox" class="checkall" />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：

$(function () {
    $('.checkall').click(function () {
        $(this).parents('div').find(':checkbox').attr('checked', this.checked);
    });
});

Upvotes: 2

PeeHaa
PeeHaa

Reputation: 72709

You have an extra quote $("input[type=checkbox]").attr('checked',**'**$(checkbox).attr('checked'));

And misspelled alert

And there is no checkbox variable

And i dont see no selectAll function (you can drop this inline stuff)

<div>

        <input type="checkbox" class="checkall" />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>

$('.checkall').change(function() {
  $('input[type="checkbox"]').attr('checked', $(this).attr('checked'));
});

And you're missing mandatory quotes after the equal sign

Basically there is lots wrong with your code. :)

EDIT

OP completely changed his code in question :P

Upvotes: 1

JohnP
JohnP

Reputation: 50039

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/>

Upvotes: 1

Related Questions