Changing skin of Raddock on server side event DockPositionChanged

2 posts, 0 answers
  1. Rao Chejarla
    Rao Chejarla avatar
    1 posts
    Member since:
    Mar 2010

    Posted 15 May 2011 Link to this post

    Hi,

    We have been experimenting with Raddock controls for our portal look on a dash board page. One of the requirements is that each RadDockZone in the layout will have different skin. When a Raddock is dragged from one zone to another it should look like every other control in the zone. One of the approaches I have tried is to change the skin of the Raddock control in DockPositionChanged event on server side. But it is not working. Any hint on how this can be accomplished would be appreciated.

    Thanks,
    Rao
  2. Pero
    Admin
    Pero avatar
    1156 posts

    Posted 17 May 2011 Link to this post

    Hi Rao,

    I have answered to your post in the respective support ticket, but I will also post my answer here so it is available to the community. Here is the code:

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <head runat="server">
        <title></title>
        <style type="text/css">
            .RadDockZone
            {
                float: left;
                margin-right: 10px;
            }
        </style>
    </head>
    <body>
        <form id="form1" runat="server">
        <asp:ScriptManager ID="RadScriptManager1" runat="server">
        </asp:ScriptManager>
        <asp:UpdatePanel ID="Updatepanel1" runat="server">
            <ContentTemplate>
                <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"
                            OnDockPositionChanged="RadDock1_DockPositionChanged" Height="300px" Skin="Hay"
                            AutoPostBack="true">
                            <ContentTemplate>
                                Dock's Content
                            </ContentTemplate>
                        </telerik:RadDock>
                        <telerik:RadDock ID="RadDock2" runat="server" Title="RadDock-Title" Width="300px"
                            OnDockPositionChanged="RadDock1_DockPositionChanged" Height="300px" Skin="Hay"
                            AutoPostBack="true">
                            <ContentTemplate>
                                Dock's Content
                            </ContentTemplate>
                        </telerik:RadDock>
                    </telerik:RadDockZone>
                    <telerik:RadDockZone ID="RadDockZone2" runat="server" MinHeight="300px" Width="300px">
                        <telerik:RadDock ID="RadDock3" runat="server" Title="RadDock-Title" Width="300px"
                            OnDockPositionChanged="RadDock1_DockPositionChanged" Height="300px" Skin="Sunset"
                            AutoPostBack="true">
                            <ContentTemplate>
                                Dock's Content
                            </ContentTemplate>
                        </telerik:RadDock>
                        <telerik:RadDock ID="RadDock4" runat="server" Title="RadDock-Title" Width="300px"
                            OnDockPositionChanged="RadDock1_DockPositionChanged" Height="300px" Skin="Sunset"
                            AutoPostBack="true">
                            <ContentTemplate>
                                Dock's Content
                            </ContentTemplate>
                        </telerik:RadDock>
                    </telerik:RadDockZone>
                </telerik:RadDockLayout>
            </ContentTemplate>
        </asp:UpdatePanel>
        </form>
    </body>
    </html>

    using System;
    using Telerik.Web.UI;
      
    public partial class Default : System.Web.UI.Page
    {
        protected void RadDock1_DockPositionChanged(object sender, DockPositionChangedEventArgs e)
        {
            RadDock dock = sender as RadDock;
            switch (e.DockZoneID)
            {
                case "RadDockZone2":
                    dock.Skin = "Sunset";
                    break;
                default:
                    dock.Skin = "Hay";
                    break;
            }
        }
    }

    All the best,
    Pero
    the Telerik team

    Browse the vast support resources we have to jump start your development with RadControls for ASP.NET AJAX. See how to integrate our AJAX controls seamlessly in SharePoint 2007/2010 visiting our common SharePoint portal.

  3. UI for ASP.NET Ajax is Ready for VS 2017
Back to Top