Asp.net select all in checkboxlist using jquery

Question

I have a checkbox for select/deselect all elements in a Asp.net checkboxlist.

All work fine for first select deselect click, after, when I click on select all the checkboxlist not render the checked value. If I inspect the code using google chrome tool, I can see that checkboxlist elements have checked="checked" but I can't see the flag checked!!

aspx code:

 <asp:CheckBox ID="selAllckb_canone" runat="server" ClientIDMode="Static" Text="Seleziona tutti" />
        <asp:CheckBoxList ID="ckb_canone" runat="server" ClientIDMode="Static" >
            <asp:ListItem>Gennaio</asp:ListItem>
            <asp:ListItem>Febbraio</asp:ListItem>
            <asp:ListItem>Marzo</asp:ListItem>
            <asp:ListItem>Aprile</asp:ListItem>
            <asp:ListItem>Maggio</asp:ListItem>
            <asp:ListItem>Giugno</asp:ListItem>
            <asp:ListItem>Luglio</asp:ListItem>
            <asp:ListItem>Agosto</asp:ListItem>
            <asp:ListItem>Settembre</asp:ListItem>
            <asp:ListItem>Ottobre</asp:ListItem>
            <asp:ListItem>Novembre</asp:ListItem>
            <asp:ListItem>Dicembre</asp:ListItem>
        </asp:CheckBoxList>

jquery code:

function sel_all(id_selAll, idcombolist) {
        $("#" + id_selAll).bind("click", function () {
            if ($(this).is(":checked")) {
                $("INPUT[id^='" + idcombolist + "_']").attr("checked", "checked");
            } else {
                $("INPUT[id^='" + idcombolist + "_']").removeAttr("checked");
            }
        });
        $("INPUT[id^='" + idcombolist + "_']").bind("click", function () {
            if ($("INPUT[id^='" + idcombolist + "_']:checked").length == $("INPUT[id^='" + idcombolist + "_']").length) {
                $("#" + id_selAll).attr("checked", "checked");
            } else {
                $("#" + id_selAll).removeAttr("checked");
            }
        });

 $(function () {

        sel_tutti("selAllckb_canone", "ckb_canone");

});

Arun P Johny · Accepted Answer · 2013-11-08 09:08:14Z

3

Use .prop() to set the checked status instead of .attr()

$("INPUT[id^='" + idcombolist + "_']").prop("checked", this.checked);

Read: Prop Vs Attrs

Try

function sel_all(id_selAll, idcombolist) {
    var $chcks = $("INPUT[id^='" + idcombolist + "_']"),
        $all = $("#" + id_selAll);
    $all.on("click", function () {
        $chcks.prop("checked", this.checked);
    });
    $chcks.on("click", function () {
        $all.prop("checked", $chcks.not(':checked').length == 0);
    });

    $(function () {
        sel_tutti("selAllckb_canone", "ckb_canone");
    });

answered Nov 8, 2013 at 9:08

Arun P Johny

389k68 gold badges532 silver badges532 bronze badges

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

Collectives™ on Stack Overflow

Asp.net select all in checkboxlist using jquery

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related