check uncheck all checkbox of checkboxlist using jquery ASP.Net

Question

i was trying to check uncheck all option of checkboxlist programmatically but my code is not working. here is snippet

 $(document).ready(function () {
    $('#myLink').click(function () {
        $("INPUT[id^='chkFileds']").attr('checked', $('#chkFileds').is(':checked'));
    });
});

what is wrong in my code. i want that when user click on check hyperlink then all option of checkbox list will be checked and when click again on the same link then all option of checkbox list will be uncheck. please guide me how to do it. thanks

UPDATE:

thanks for ur answer but i am not talking about check rather checkbox list what has many checkbox inside.it looks like....he i am giving the html of checkboxlist

<table style="font-weight:bold;" id="chkCountry">
    <tbody>
        <tr>
            <td>
                <input type="checkbox" value="GB" name="chkCountry$0" id="chkCountry_0">
                <label for="chkCountry_0">UK</label>
            </td>
            <td>
                <input type="checkbox" value="US" name="chkCountry$1" id="chkCountry_1">
                <label for="chkCountry_1">USA</label>
            </td>
        </tr>
    </tbody>
</table>

Is your ID misspelled consistently across all your check boxes? Maybe it should be $("INPUT[id^='chkFields']"). In addition, what does $('#chkFileds') refer to? — James Hill
– James Hill, Commented Mar 2, 2012 at 13:22
It's going to be much easier to help if you also include the HTML that this is supposed to work with. — Anthony Grist
– Anthony Grist, Commented Mar 2, 2012 at 13:44

James Hill · Accepted Answer · 2012-03-05 12:37:07Z

6

You markup is still missing some of the relevant code needed to answer the question properly, but, assuming that myLink is a checkbox, the code below will work.

$(document).ready(function () {
   $('#myLink').click(function () {
      $("INPUT[id^='chkCountry_']").attr('checked', $('#myLink').is(':checked'));
   });
});

Here's a working fiddle.

Note: You're code is not working for several reasons. Mainly, your selector, chkFileds, doesn't relate to the markup you posted in any way.

Additional Info:

Here's a quick rundown of the attribute selector operators:

=  is exactly equal
!= is not equal
^= starts with
$= ends with
*= contains

edited Mar 5, 2012 at 12:37

answered Mar 2, 2012 at 14:35

James Hill

62.2k22 gold badges150 silver badges166 bronze badges

Sign up to request clarification or add additional context in comments.

3 Comments

Thomas Over a year ago

i change $("INPUT[id^='chkCountry_']") to $("INPUT[id*='chkCountry_']") and now it is working....thanks

James Hill Over a year ago

@Thomas, see edit (additional info section). Unless your markup is incorrect, ^=, which indicates starts with should have worked. Either way, glad it's working.

Hassan Mokdad Over a year ago

Thanks for the asnwer and Additional Info, this is the best way I have seen till now to implement a check all functionality in asp.net

adeneo · Accepted Answer · 2012-03-02 13:31:20Z

0

If your selectors are correct, and they do seem a bit strange, maybe something like this:

$(document).ready(function () {
    $('#myLink').on('click', function () {
        var check = $('#chkFileds').is(':checked') ? false:true;
        $("INPUT[id^='chkFileds']").prop('checked', check);
    });
});

FIDDLE

What exactly do you mean by "all" options, you are targeting an ID, and it's unique?

edited Mar 2, 2012 at 13:31

answered Mar 2, 2012 at 13:23

adeneo

319k29 gold badges410 silver badges392 bronze badges

5 Comments

pete Over a year ago

Since .is(':checked') returns a boolean, you don't actually need the ternary operator... var check = $('#chkFileds').is(':checked'); is sufficient. :)

adeneo Over a year ago

@pete - It's the other way around? true is false and false is true. Could have used not or !, but did it that way?

Anthony Grist Over a year ago

He's modifying all inputs with an ID that begins with "chkFileds", not only a single element with an ID that equals that string. The checked status for each of those elements is set to the checked status of the element with ID chkFileds. Taking the inverse of the value doesn't seem consistent with the question.

Thomas Over a year ago

thanks for ur answer but i am not talking about check rather checkbox list what has many checkbox inside. it looks like....he i am giving the html of checkboxlist <table style="font-weight:bold;" id="chkCountry"> <tbody><tr> <td><input type="checkbox" value="GB" name="chkCountry$0" id="chkCountry_0"><label for="chkCountry_0">UK</label></td> <td><input type="checkbox" value="US" name="chkCountry$1" id="chkCountry_1"><label for="chkCountry_1">USA</label></td> </tr> </tbody></table>

James Hill Over a year ago

@Thomas, post your relevant HTML in your question, not in comments.

Collectives™ on Stack Overflow

check uncheck all checkbox of checkboxlist using jquery ASP.Net

2 Answers 2

3 Comments

5 Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

3 Comments

5 Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related