Sumit
Sumit

Reputation: 1

how to check and uncheck all checkboxes on button click using vb.net?

I have 5 checkboxes in my webform.

i have button1 whose text is select all ....

i want when button1 text is select all then i clcik on button then all the checkboxes will be checked and button1 text will be unselect all .... if the button text is unselect all then all the checkboxes will be unchecked ...

how to do this using vb.net ?

Upvotes: 0

Views: 10206

Answers (2)

MikeM
MikeM

Reputation: 27405

Something like this should get it

ASPX:

<asp:UpdatePanel ID="UpdatePanel1" runat="server">
    <ContentTemplate>
        <asp:Button ID="Button1" runat="server" Text="Check All" />
        <asp:CheckBoxList ID="CheckBoxList1" runat="server">
            <asp:ListItem Text="apple" Value="apple" />
            <asp:ListItem Text="banana" Value="banana" />
            <asp:ListItem Text="grapes" Value="grapes" />
            <asp:ListItem Text="kiwi" Value="kiwi" />
            <asp:ListItem Text="orange" Value="orange" />
        </asp:CheckBoxList>
    </ContentTemplate>
</asp:UpdatePanel>

VB.NET:

Protected Sub Button1_Click(ByVal sender As Object, ByVal e As System.EventArgs) Handles Button1.Click
    Dim toggle As Boolean = True
    If Button1.Text = "Check All" Then
        Button1.Text = "Uncheck All"
    Else
        Button1.Text = "Check All"
        toggle = False
    End If

    For Each li As ListItem In CheckBoxList1.Items
        li.Selected = toggle
    Next
End Sub

Alternatively you could do this easily client side jquery

something like

$('#Button1').click(function() {
    var toggle = true;
    if ($(this).val() === "Check All") {
        $(this).val("Uncheck All");
    } else {
        $(this).val("Check All");
        toggle = false;
    }
    $('.myCheckBoxes :checkbox').attr("checked", toggle);
});

Upvotes: 3

Mun
Mun

Reputation: 14308

I'd recommend using jQuery for this. You would need something like the following in your ASPX file:

<script type="text/javascript">
    $(function() {
        $(".select-all-button").click(function() {
            var any = ($(".cb > input:checked").length > 0);
            $(".cb > input").attr("checked", !any);
        });
    });
</script>

<asp:Button ID="SelectAllButton" Text="Select All" CssClass="select-all-button" runat="server"/><br/><br/>

<asp:CheckBox ID="CheckBox1" CssClass="cb" Text="CheckBox 1" runat="Server" /><br/>
<asp:CheckBox ID="CheckBox2" CssClass="cb" Text="CheckBox 2" runat="Server" /><br/>
<asp:CheckBox ID="CheckBox3" CssClass="cb" Text="CheckBox 3" runat="Server" /><br/>
<asp:CheckBox ID="CheckBox4" CssClass="cb" Text="CheckBox 4" runat="Server" /><br/>
<asp:CheckBox ID="CheckBox5" CssClass="cb" Text="CheckBox 5" runat="Server" /><br/>

Upvotes: 0

Related Questions