DropDownTree - Checkboxes

SingleCheck

  • Fuller
    • Davolio
    • Leverling
    • Peacock
    • Buchanan
      • Suyama
      • King
      • Dodsworth
    • Callahan

CheckChildNodes

  • Fuller
    • Davolio
    • Leverling
    • Peacock
    • Buchanan
      • Suyama
      • King
      • Dodsworth
    • Callahan

TriState

  • Fuller
    • Davolio
    • Leverling
    • Peacock
    • Buchanan
      • Suyama
      • King
      • Dodsworth
    • Callahan
Isolate this demo as a stand-alone application
  • About this demo
  • C#
  • VB

RadDropDownTree   has a built-in property that enables easy use of checkboxes. The default value is "None" and there are three other states that can be set to the nodes of the tree in the dropdown:

SingleCheck - Enables checking of nodes without effecting its child or parent nodes like in "CheckChildNodes" and "TriState". .

CheckChildNodes - Checks all child and sub child nodes (if there are any) of a single node .

TriState - When set in the DropDownTree it allows for Nodes' CheckBoxes to have an additional, third state called Indeterminate. A Node's CheckBox is in Indeterminate state if it has both Checked and Unchecked CheckBoxes of child Nodes.

  • DefaultCS.aspx
  • DefaultCS.aspx.cs
  • styles.css
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="DefaultCS.aspx.cs" Inherits="DropDownTree.Examples.Functionality.Checkboxes.DefaultCS" %>

<%@ Register TagPrefix="telerik" Namespace="Telerik.Web.UI" Assembly="Telerik.Web.UI" %>
<%@ Register TagPrefix="qsf" Namespace="Telerik.QuickStart" %>
<!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>
    <link rel="stylesheet" href="styles.css" />
</head>
<body>
    <form id="form1" runat="server">
    <telerik:RadScriptManager runat="server" ID="RadScriptManager1" />
    <telerik:RadSkinManager ID="RadSkinManager1" runat="server" ShowChooser="true" />
    <div class="demo-containers">
        <div class="demo-container size-thin">
            <h2>SingleCheck
            </h2>
            <telerik:RadDropDownTree RenderMode="Lightweight" ID="RadDropDownTree1" runat="server" Width="300px" CheckBoxes="SingleCheck"
                DefaultMessage="Please select" DataFieldID="EmployeeID" DataFieldParentID="ReportsTo" OnNodeDataBound="RadDropDownTree1_NodeDataBound"
                DataTextField="LastName" DataSourceID="SqlDataSource1">
                <DropDownSettings OpenDropDownOnLoad="true" />
            </telerik:RadDropDownTree>
        </div>
        <div class="demo-container size-thin">
            <h2>CheckChildNodes</h2>

            <telerik:RadDropDownTree RenderMode="Lightweight" ID="RadDropDownTree2" runat="server" Width="300px" CheckBoxes="CheckChildNodes"
                DefaultMessage="Please select" DataFieldID="EmployeeID" DataFieldParentID="ReportsTo"
                DataTextField="LastName" DataSourceID="SqlDataSource1" OnNodeDataBound="RadDropDownTree1_NodeDataBound">
                <DropDownSettings />
            </telerik:RadDropDownTree>
        </div>
        <div class="demo-container size-thin">
            <h2>TriState</h2>

            <telerik:RadDropDownTree RenderMode="Lightweight" ID="RadDropDownTree3" runat="server" Width="300px" CheckBoxes="TriState"
                DefaultMessage="Please select" DataFieldID="EmployeeID" DataFieldParentID="ReportsTo"
                DataTextField="LastName" DataSourceID="SqlDataSource1" OnNodeDataBound="RadDropDownTree1_NodeDataBound">
                <DropDownSettings />
            </telerik:RadDropDownTree>
        </div>
    </div>
    <asp:SqlDataSource runat="server" ID="SqlDataSource1" ConnectionString="<%$ ConnectionStrings:NorthwindConnectionString %>"
        SelectCommand="SELECT * From Employees"></asp:SqlDataSource>
    </form>
</body>
</html>

Support & Learning Resources

Find Assistance

Help Us Improve

Was this example helpful?