Reputation: 1
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
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
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