Custom Command

3 posts, 1 answers
  1. suvina paul
    suvina  paul avatar
    5 posts
    Member since:
    May 2010

    Posted 25 May 2010 Link to this post

    How to modify the image that appears as a custom command's icon. I tried the sample customdockcommand but it doesnt work for me, any other way of doing it?
  2. Answer
    Pero
    Admin
    Pero avatar
    1156 posts

    Posted 25 May 2010 Link to this post

    Hi Suvina,

    This can be easily achieved by setting a CssClass to the custom command, and then applying custom styling as shown in the sample code below:

    <%@ Register Assembly="Telerik.Web.UI" Namespace="Telerik.Web.UI" TagPrefix="telerik" %>
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <head id="Head1" runat="server">
        <title></title>
        <style type="text/css">
            .customCommand
            {
                background-image: url(img/customclose.png) !important;
            }
        </style>
    </head>
    <body>
        <form id="form1" runat="server">
        <asp:ScriptManager ID="ScriptManager1" runat="server">
            <Scripts>
                <asp:ScriptReference Assembly="Telerik.Web.UI" Name="Telerik.Web.UI.Common.Core.js" />
            </Scripts>
        </asp:ScriptManager>
        <div>
            <asp:Button ID="Button1" runat="server" Text="Set Height" OnClick="Button1_Click" />
            <telerik:RadDockLayout ID="RadDockLayout1" runat="server">
                <telerik:RadDockZone ID="RadDockZone1" runat="server" MinHeight="300px" Width="300px">
                    <telerik:RadDock ID="RadDock1" runat="server" Title="RadDock-Title" Width="300px">
                        <Commands>
                            <telerik:DockToggleCommand CssClass="customCommand" />
                        </Commands>
                        <ContentTemplate>
                            <br />
                            <br />
                            <br />
                            <br />
                            <br />
                            CONTENT
                            <br />
                            <br />
                            <br />
                            <br />
                            <br />
                        </ContentTemplate>
                    </telerik:RadDock>
                </telerik:RadDockZone>
            </telerik:RadDockLayout>
        </div>
        </form>
    </body>
    </html>
     

    Regards,
    Pero
    the Telerik team

    Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items.
  3. UI for ASP.NET Ajax is Ready for VS 2017
  4. suvina paul
    suvina  paul avatar
    5 posts
    Member since:
    May 2010

    Posted 25 May 2010 Link to this post

    Thanks a ton. This worked!!!!
Back to Top