New to Telerik UI for ASP.NET AJAX? Download free 30-day trial

Checkboxes

Checked Items:

RadListBox fully supports checkboxes, which are displayed next to the ListBoxItems. You can enable the checkboxes mode by setting the listbox's CheckBoxes property to True.

You can show the CheckAll button that allows checking or unchecking all the items with one click by setting ShowCheckAll property to True.

  • DefaultCS.aspx
  • DefaultCS.aspx.cs
<%@ Page AutoEventWireup="true" CodeFile="DefaultCS.aspx.cs" Inherits="ListBox.Examples.Functionality.CheckBoxes.DefaultCS"Language="C#"  %>

<!DOCTYPE html>
<html xmlns='http://www.w3.org/1999/xhtml'>
<head runat="server">
    <title>Telerik ASP.NET Example</title>
</head>

<body>
    <form id="form1" runat="server">
    <telerik:RadScriptManager runat="server" ID="RadScriptManager1" />
    <telerik:RadSkinManager ID="RadSkinManager1" runat="server" ShowChooser="true" />

    <telerik:RadAjaxPanel runat="server" ID="RadAjaxPanel1" CssClass="demo-containers">

        <div class="demo-container size-thin">
            <telerik:RadListBox RenderMode="Lightweight" ID="RadListBox1" runat="server" CheckBoxes="true" ShowCheckAll="true" Width="300"
                Height="300px">
                <Items>
                    <telerik:RadListBoxItem Text="Arts" />
                    <telerik:RadListBoxItem Text="Biographies" />
                    <telerik:RadListBoxItem Text="Children's Books" />
                    <telerik:RadListBoxItem Text="Computers &amp; Internet" />
                    <telerik:RadListBoxItem Text="Cooking" />
                    <telerik:RadListBoxItem Text="History" />
                    <telerik:RadListBoxItem Text="Fiction" />
                    <telerik:RadListBoxItem Text="Mystery" />
                    <telerik:RadListBoxItem Text="Nonfiction" />
                    <telerik:RadListBoxItem Text="Romance" />
                    <telerik:RadListBoxItem Text="Science Fiction " />
                    <telerik:RadListBoxItem Text="Travel" />
                </Items>
            </telerik:RadListBox>
        </div>

        <div class="demo-container size-thin">
            <telerik:RadButton RenderMode="Lightweight" ID="Button1" runat="server" Text="Get Checked Items!" OnClick="Button1_Click" />
            <p>
                <strong>Checked Items:</strong><br />
                <asp:Literal ID="itemsClientSide" runat="server" />
            </p>
        </div>

    </telerik:RadAjaxPanel>

    </form>
</body>
</html>

Support & Learning Resources

Find Assistance