ListBox - Checkboxes

Checked Items:

Isolate this demo as a stand-alone application
  • About this demo
  • C#
  • VB

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 PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<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>

Find Assistance

Help Us Improve

Was this example helpful?