Can RadToolBarSplitButton Look "selected"?

3 posts, 0 answers
  1. Doug Rutledge
    Doug Rutledge avatar
    18 posts
    Member since:
    Apr 2008

    Posted 05 Aug 2008 Link to this post

    Is there an easy way to make the RadToolBarSplitButton look/act like a regular RadToolBarButton when one of its items are selected?  I want to use a couple of RadToolBarSplitButtons with a RadToolBarButton and be able to have it act and look like I'm using three RadToolBarButtons that are in the same group.  I have them unchecking the RadToolBarButton when on of the SplitBarButtons are selected, but the RadToolBarSplitButtons don't look "selected" like the regular tool bar buttons when they are pressed.

    Here is what I have.

    <telerik:RadToolBar runat="server" style="display:block; float: none" Skin="WebBlue" ID="tbInventory">  
        <Items> 
            <telerik:RadToolBarButton Group="Inventory" CheckOnClick="true" Text="Pending"></telerik:RadToolBarButton> 
            <telerik:RadToolBarButton IsSeparator="true"></telerik:RadToolBarButton> 
            <telerik:RadToolBarSplitButton > 
                <Buttons> 
                    <telerik:RadToolBarButton Group="Inventory" CheckOnClick="true" Text="Sold: Last 30 Days"></telerik:RadToolBarButton> 
                    <telerik:RadToolBarButton Group="Inventory" CheckOnClick="true" Text="Sold: Last 60 Days"></telerik:RadToolBarButton> 
                    <telerik:RadToolBarButton Group="Inventory" CheckOnClick="true" Text="Sold: Last 90 Days"></telerik:RadToolBarButton> 
                </Buttons> 
            </telerik:RadToolBarSplitButton> 
            <telerik:RadToolBarButton IsSeparator="true"></telerik:RadToolBarButton> 
            <telerik:RadToolBarSplitButton> 
                <Buttons> 
                    <telerik:RadToolBarButton Group="Inventory" CheckOnClick="true" Text="For Sale"></telerik:RadToolBarButton> 
                    <telerik:RadToolBarButton Group="Inventory" CheckOnClick="true" Text="For Sale: Not At TDA"></telerik:RadToolBarButton> 
                    <telerik:RadToolBarButton Group="Inventory" CheckOnClick="true" Text="For Sale: Not Listed"></telerik:RadToolBarButton> 
                </Buttons> 
            </telerik:RadToolBarSplitButton> 
        </Items> 
    </telerik:RadToolBar> 


    Any ideas?
    Doug

  2. Alex Gyoshev
    Admin
    Alex Gyoshev avatar
    2500 posts

    Posted 08 Aug 2008 Link to this post

    Hi Doug Rutledge,

    You can use the following CSS to achieve the desired look:
    .RadToolBar_WebBlue .rtbChecked 
        background#f0f2f4
        color#00156e

    Sincerely yours,
    Alex
    the Telerik team

    Check out Telerik Trainer, the state of the art learning tool for Telerik products.
  3. UI for ASP.NET Ajax is Ready for VS 2017
  4. kbtech
    kbtech avatar
    1 posts
    Member since:
    Jun 2007

    Posted 31 May 2010 Link to this post

    HI,

    I'm trying to achive the same but i'm unable to get the css you've recommended to work.

    I have a masterpage in which i've defined the css and i have my radtoolbar, but the css isn't applied which a radtoolbarbutton is clicked.

    This is my master page

    <%

    @ Master Language="C#" AutoEventWireup="true" CodeFile="MasterPage.master.cs" Inherits="MasterPage" %>

     

    <!

     

    DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

     

    <

     

    html xmlns="http://www.w3.org/1999/xhtml">

     

    <

     

    head id="Head1" runat="server">

     

     

    <title></title>

     

     

    <telerik:RadStyleSheetManager id="RadStyleSheetManager1" runat="server" />

     

     

    <style type="text/css">

     

     

    .RadToolBar_WebBlue .rtbChecked

     

    {

     

    background: #f0f2f4;

     

     

    color: #00156e;

     

    }

     

    .rtbChecked .rtbText {

     

     

    font-weight:bold !important;

     

    }

     

    </style>

     

    </

     

    head>

     

    <

     

    body>

     

     

    <form id="form2" runat="server">

     

     

    <telerik:RadScriptManager ID="RadScriptManager1" runat="server">

     

     

    <Scripts>

     

     

    <asp:ScriptReference Assembly="Telerik.Web.UI" Name="Telerik.Web.UI.Common.Core.js" />

     

     

    </Scripts>

     

     

    </telerik:RadScriptManager>

     

     

    <telerik:RadAjaxManager ID="RadAjaxManager1" runat="server">

     

     

    </telerik:RadAjaxManager>

     

     

    <telerik:RadSkinManager ID="RadSkinManager1" runat="server" ShowChooser="false" Skin="WebBlue">

     

     

    <TargetControls>

     

     

    <telerik:TargetControl ControlID="RadComboBox1" Skin="Vista" />

     

     

    <telerik:TargetControl ControlID="RadEditor1" Skin="Vista" />

     

     

    <telerik:TargetControl ControlID="RadDatePicker1" Skin="WebBlue" />

     

     

    <telerik:TargetControl ControlID="RadNumericTextBox1" Skin="Outlook" />

     

     

    <telerik:TargetControl ControlID="RadTreeView1" Skin="WebBlue" />

     

     

    <telerik:TargetControl ControlID="RadMenu1" Skin="Outlook" />

     

     

    <telerik:TargetControl ControlID="RadTabStrip1" Skin="Sunset" />

     

     

    <telerik:TargetControl ControlID="RadPanelBar1" Skin="Hay" />

     

     

    </TargetControls>

     

     

    </telerik:RadSkinManager>

     

     

    <div>

     

     

    <telerik:RadToolBar ID="RadToolBar1" runat="server" Width="100%">

     

     

    <Items>

     

     

    <telerik:RadToolBarButton runat="server" Text="Quotations" NavigateUrl="~/Default.aspx" >

     

     

    </telerik:RadToolBarButton>

     

     

    <telerik:RadToolBarButton IsSeparator="True" runat="server"></telerik:RadToolBarButton>

     

     

    <telerik:RadToolBarButton runat="server" Text="Boat Setup" NavigateUrl="~/Boats.aspx">

     

     

    </telerik:RadToolBarButton>

     

     

    <telerik:RadToolBarButton IsSeparator="True" runat="server"></telerik:RadToolBarButton>

     

     

    <telerik:RadToolBarButton runat="server" Text="Options Setup" NavigateUrl="~/Options.aspx">

     

     

    </telerik:RadToolBarButton>

     

     

    <telerik:RadToolBarButton IsSeparator="True" runat="server"></telerik:RadToolBarButton>

     

     

    <telerik:RadToolBarButton runat="server" Text="Dealer Options Setup" NavigateUrl="~/DealerOptions.aspx">

     

     

    </telerik:RadToolBarButton>

     

     

    <telerik:RadToolBarButton IsSeparator="True" runat="server"></telerik:RadToolBarButton>

     

     

    <telerik:RadToolBarButton runat="server" Text="Users Setup" NavigateUrl="~/Users.aspx">

     

     

    </telerik:RadToolBarButton>

     

     

    <telerik:RadToolBarButton IsSeparator="True" runat="server"></telerik:RadToolBarButton>

     

     

    </Items>

     

     

    </telerik:RadToolBar>

     

     

    <asp:contentplaceholder id="ContentPlaceHolder1" runat="server">

     

     

    </asp:contentplaceholder>

     

     

    </div>

     

     

    </form>

     

    </

     

    body>

     

    </

     

    html>

     



    Any idea's?

    Cheers Paul.

Back to Top