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

Add/Remove/Disable Items

  • Add Button
  • Add Separator
  • Add Checked Button
  • Add...
    • Add Button
    • Add Separator
    • Add Checked Button
  • Add Button
    • Add Button
    • Add Separator
    • Add Checked Button
  • Demo Configurator
  • Add new button
  • Add other items
  • Remove
  • Enable/Disable
  • TargetToolBar

The Items collection of the RadToolBar object exposes the root items of a RadToolBar. The child buttons of a dropdown or split button can be accessed using the Buttons collections of these items.

This example demonstrates the server-side creation of the three types of toolbar items described above.

You can create a root RadToolBarButton by using the code below:

C#:

RadToolBarButton rootButton = new RadToolBarButton("Bold");
RadToolBar1.Items.Add(rootButton);

VB:

Dim rootButton as RadToolBarButton = new RadToolBarButton("Bold")
RadToolBar1.Items.Add(rootButton)

You can create a RadToolBarDropDown and add a checkable RadToolBarButtonto it by using the code below:

C#:

RadToolBarDropDown dropDown = new RadToolBarDropDown("Align");
RadToolBar1.Items.Add(dropDown);
RadToolBarButton leftButton = new RadToolBarButton("Left", true, "AlignGroup");
dropDown.Buttons.Add(leftButton);

VB:

Dim dropDown as RadToolBarDropDown = new RadToolBarDropDown("Align")
RadToolBar1.Items.Add(dropDown)
Dim leftButton as RadToolBarButton = new RadToolBarButton("Left", true, "AlignGroup")
dropDown.Buttons.Add(leftButton)
  • DefaultCS.aspx
  • DefaultCS.aspx.cs
  • styles.css
  • toolbar.xml
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="DefaultCS.aspx.cs" Inherits="ToolBar.Examples.ServerSide.AddRemoveDisable.DefaultCS" %>

<%@ Register TagPrefix="telerik" Namespace="Telerik.Web.UI" Assembly="Telerik.Web.UI" %>
<!DOCTYPE html>
<html xmlns='http://www.w3.org/1999/xhtml'>
<head runat="server">
    <title>Telerik ASP.NET Example</title>
    <link rel="stylesheet" type="text/css" 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-container">
        <telerik:RadToolBar RenderMode="Lightweight" runat="server" ID="RadToolBar1" EnableRoundedCorners="true" EnableShadows="true">
        </telerik:RadToolBar>
    </div>
    <qsf:ConfiguratorPanel runat="server" ID="ConfigurationPanel1" Expanded="true">
        <Views>
            <qsf:View Title="Add new button">
                <qsf:ConfiguratorColumn runat="server" Size="Medium">
                    <ul class="fb-group">
                        <li>
                            <qsf:DropDownList ID="ddlTarget" runat="server" Label="Target">
                                <Items>
                                    <telerik:DropDownListItem Text="ToolBar" />
                                    <telerik:DropDownListItem Text="Last DropDown" />
                                    <telerik:DropDownListItem Text="Last SplitButton" />
                                </Items>
                            </qsf:DropDownList>
                        </li>
                        <li>
                            <asp:CheckBox runat="server" ID="cbChecked" Text="Checked state" CssClass="cbChecked"></asp:CheckBox>
                            <qsf:Button ID="btnAddButton" runat="server" OnClick="btnAddButton_Click" Text="Add"></qsf:Button>
                        </li>
                    </ul>
                </qsf:ConfiguratorColumn>
            </qsf:View>
            <qsf:View Title="Add other items">
                <qsf:Button ID="btnAddDropDown" runat="server" OnClick="btnAddDropDown_Click" Text="Add new DropDown">
                </qsf:Button>
                <qsf:Button ID="btnAddSplitButton" runat="server" OnClick="btnAddSplitButton_Click" Text="Add new SplitButton">
                </qsf:Button>
            </qsf:View>
            <qsf:View Title="Remove">
                <qsf:Button ID="btnRemoveLastItem" runat="server" OnClick="btnRemoveLastItem_Click" Text="Remove last toolbar item"></qsf:Button>
                <asp:Label ID="lblError" CssClass="lblError" runat="server"></asp:Label>
            </qsf:View>
            <qsf:View Title="Enable/Disable">
                <qsf:Button ID="btnEnableLastItem" runat="server" OnClick="btnEnableLastItem_Click" Text="Enable last toolbar item">
                </qsf:Button>
                <qsf:Button ID="btnDisableLastItem" runat="server" OnClick="btnDisableLastItem_Click" Text="Disable last toolbar item">
                </qsf:Button>
            </qsf:View>
        </Views>
    </qsf:ConfiguratorPanel>
    </form>
</body>
</html>

Support & Learning Resources

Find Assistance