My Portal within masterpage

2 posts, 0 answers
  1. Mattias Moberg
    Mattias Moberg avatar
    18 posts
    Member since:
    Aug 2009

    Posted 15 Jul 2011 Link to this post

    I´m having problem to handle drag docks from dockzones that are not in same content placeholder.
    Anyone that could help me out?

    Markup:
    <%@ Page Title="" Language="C#" MasterPageFile="~/App_master/SiteTwoColumn.master"
        AutoEventWireup="true" CodeFile="EditPageSiteTwoColumn.aspx.cs" Inherits="EditPageSiteTwoColumn" %>
     
    <asp:Content ID="Content1" ContentPlaceHolderID="SideBar" runat="Server">
     
        <telerik:RadDockLayout runat="server" ID="RadDockLayout2" Skin="Clear" EnableEmbeddedSkins="false">
            <telerik:RadDockZone runat="server" ID="RadDockZone2" MinHeight="200">
            </telerik:RadDockZone>
        </telerik:RadDockLayout>
    </asp:Content>
    <asp:Content ID="Content2" ContentPlaceHolderID="MainContent" runat="Server">
        <table style="width: 100%;">
            <tr>
                <td style="width: 140px">
                    Select Module:
                </td>
                <td style="width: 140px">
                    <asp:DropDownList runat="server" ID="DroptDownWidget" Width="150">
                        <asp:ListItem Text="Blogg.ascx" Value="~/UserControls/Blogg/Blogg.ascx"></asp:ListItem>
                        <asp:ListItem Text="Footer.ascx" Value="~/UserControls/Footer/Footer.ascx"></asp:ListItem>
                    </asp:DropDownList>
                </td>
                <td>
                </td>
                <td style="width: 100px">
                    <asp:Button runat="server" ID="ButtonPostBack" Text="Make PostBack" OnClick="ButtonPostBack_Click" />
                </td>
            </tr>
            <tr>
                <td>
                    Select Docking Zone:
                </td>
                <td>
                    <asp:DropDownList ID="DropDownZone" runat="server" DataSource="<%#GetZones() %>"
                        DataTextField="ID" DataValueField="ClientID" Width="150">
                    </asp:DropDownList>
                </td>
                <td>
                    <asp:Button runat="server" ID="ButtonAddDock" Text="Add Dock (AJAX)" OnClick="ButtonAddDock_Click" />
                </td>
                <td>
                    <asp:Button runat="server" ID="ButtonClear" Text="Clear Dock State" OnClick="ButtonClear_Click" />
                </td>
            </tr>
        </table>
        <asp:UpdatePanel runat="server" ID="UpdatePanel2" ChildrenAsTriggers="false" UpdateMode="Conditional">
            <ContentTemplate>
                <br />
                <telerik:RadDockLayout runat="server" ID="RadDockLayout1" OnSaveDockLayout="RadDockLayout1_SaveDockLayout"
                    OnLoadDockLayout="RadDockLayout1_LoadDockLayout" Skin="Clear" EnableEmbeddedSkins="false">
                    <telerik:RadDockZone runat="server" ID="RadDockZone1" Width="591" MinHeight="200">
                    </telerik:RadDockZone>
                </telerik:RadDockLayout>
            </ContentTemplate>
            <Triggers>
                <asp:AsyncPostBackTrigger ControlID="ButtonAddDock" EventName="Click" />
            </Triggers>
        </asp:UpdatePanel>
        <div style="width: 0px; height: 0px; overflow: hidden; position: absolute; left: -10000px;">
            Hidden UpdatePanel, which is used to help with saving state when minimizing, moving
            and closing docks. This way the docks state is saved faster (no need to update the
            docking zones).
            <asp:UpdatePanel runat="server" ID="UpdatePanel1">
            </asp:UpdatePanel>
        </div>
    </asp:Content>

    Code:
    using System;
    using System.Collections;
    using System.Collections.Generic;
    using System.ComponentModel;
    using System.Data;
    using System.Drawing;
    using System.Web;
    using System.Web.SessionState;
    using System.Web.UI;
    using System.Web.UI.WebControls;
    using System.Web.UI.HtmlControls;
    using Telerik.Web.UI;
     
    public partial class EditPageSiteTwoColumn : System.Web.UI.Page
    {
        private bool _dockStateCleared = false;
        private List<DockState> CurrentDockStates
        {
            get
            {
                //Store the info about the added docks in the session. For real life
                // applications we recommend using database or other storage medium
                // for persisting this information.
                List<DockState> _currentDockStates = (List<DockState>)Session["CurrentDockStatesMyPortal"];
                if (Object.Equals(_currentDockStates, null))
                {
                    _currentDockStates = new List<DockState>();
                    Session["CurrentDockStatesMyPortal"] = _currentDockStates;
                }
                return _currentDockStates;
            }
            set
            {
                Session["CurrentDockStatesMyPortal"] = value;
            }
        }
     
        protected void Page_Load(object sender, EventArgs e)
        {
            if (!IsPostBack)
            {
                DropDownZone.DataBind();
            }
        }
     
        public ArrayList GetZones()
        {
            ArrayList zones = new ArrayList();
            zones.Add(RadDockZone1);
            return zones;
        }
     
        protected void Page_Init(object sender, EventArgs e)
        {
            //Recreate the docks in order to ensure their proper operation
            for (int i = 0; i < CurrentDockStates.Count; i++)
            {
                if (CurrentDockStates[i].Closed == false)
                {
                    RadDock dock = CreateRadDockFromState(CurrentDockStates[i]);
                    //We will just add the RadDock control to the RadDockLayout.
                    // You could use any other control for that purpose, just ensure
                    // that it is inside the RadDockLayout control.
                    // The RadDockLayout control will automatically move the RadDock
                    // controls to their corresponding zone in the LoadDockLayout
                    // event (see below).
                    RadDockLayout1.Controls.Add(dock);
                    //We want to save the dock state every time a dock is moved.
                    CreateSaveStateTrigger(dock);
                    //Load the selected widget
                    LoadWidget(dock);
                }
            }
        }
     
        protected void RadDockLayout1_LoadDockLayout(object sender, DockLayoutEventArgs e)
        {
            //Populate the event args with the state information. The RadDockLayout control
            // will automatically move the docks according that information.
            foreach (DockState state in CurrentDockStates)
            {
                e.Positions[state.UniqueName] = state.DockZoneID;
                e.Indices[state.UniqueName] = state.Index;
            }
        }
     
        protected void RadDockLayout1_SaveDockLayout(object sender, DockLayoutEventArgs e)
        {
            if (!_dockStateCleared)
            {
                //Save the dock state in the session. This will enable us
                // to recreate the dock in the next Page_Init.
                CurrentDockStates = RadDockLayout1.GetRegisteredDocksState();
            }
            else
            {
                //the clear state button was clicked, so we refresh the page and start over.
                Response.Redirect(Request.RawUrl, false);
            }
        }
     
        private RadDock CreateRadDockFromState(DockState state)
        {
            RadDock dock = new RadDock();
            dock.DockMode = DockMode.Docked;
            dock.ID = string.Format("RadDock{0}", state.UniqueName);
            dock.ApplyState(state);
            dock.Commands.Add(new DockCloseCommand());
            dock.Commands.Add(new DockExpandCollapseCommand());
     
            return dock;
        }
     
        private RadDock CreateRadDock()
        {
            int docksCount = CurrentDockStates.Count;
     
            RadDock dock = new RadDock();
            dock.DockMode = DockMode.Docked;
            dock.UniqueName = Guid.NewGuid().ToString().Replace("-", "a");
            dock.ID = string.Format("RadDock{0}", dock.UniqueName);
            dock.Title = "Blog module";
            dock.Text = string.Format("Added at {0}", DateTime.Now);
            dock.Width = Unit.Pixel(300);
            dock.Resizable = true;
     
            dock.Commands.Add(new DockCloseCommand());
            dock.Commands.Add(new DockExpandCollapseCommand());
     
            return dock;
        }
     
        private void CreateSaveStateTrigger(RadDock dock)
        {
            //Ensure that the RadDock control will initiate postback
            // when its position changes on the client or any of the commands is clicked.
            //Using the trigger we will "ajaxify" that postback.
            dock.AutoPostBack = true;
            dock.CommandsAutoPostBack = true;
     
            AsyncPostBackTrigger saveStateTrigger = new AsyncPostBackTrigger();
            saveStateTrigger.ControlID = dock.ID;
            saveStateTrigger.EventName = "DockPositionChanged";
            UpdatePanel1.Triggers.Add(saveStateTrigger);
     
            saveStateTrigger = new AsyncPostBackTrigger();
            saveStateTrigger.ControlID = dock.ID;
            saveStateTrigger.EventName = "Command";
            UpdatePanel1.Triggers.Add(saveStateTrigger);
        }
     
        private void LoadWidget(RadDock dock)
        {
            if (string.IsNullOrEmpty(dock.Tag))
            {
                return;
            }
            Control widget = LoadControl(dock.Tag);
            dock.ContentContainer.Controls.Add(widget);
        }
     
     
        protected void ButtonAddDock_Click(object sender, EventArgs e)
        {
            RadDock dock = CreateRadDock();
            //find the target zone and add the new dock there
     
            ContentPlaceHolder mainContent = (ContentPlaceHolder)this.Master.FindControl("MainContent");
            RadDockZone dz = (RadDockZone)FindControl(mainContent.FindControl("UpdatePanel2"), "RadDockZone1");
            if (dz != null)
            {
                dz.Controls.Add(dock);
                CreateSaveStateTrigger(dock);
     
                //Load the selected widget in the RadDock control
                dock.Tag = DroptDownWidget.SelectedValue;
                LoadWidget(dock);
     
                //Add RadDockZoneInfo text
     
            }
        }
        protected void ButtonPostBack_Click(object sender, EventArgs e)
        {
            //normal postback
        }
        protected void ButtonClear_Click(object sender, EventArgs e)
        {
     
            //clear docks state from the session
            CurrentDockStates.Clear();
            _dockStateCleared = true;
        }
     
        private Control FindControl(Control firstLevel, string Id)
        {
     
            if (firstLevel.ID == Id)
     
                return firstLevel;
     
            foreach (Control Ctl in firstLevel.Controls)
            {
     
                Control c = FindControl(Ctl, Id);
     
                if (c != null)
     
                    return c;
            }
            return null;
        }
    }
  2. Pero
    Admin
    Pero avatar
    1156 posts

    Posted 20 Jul 2011 Link to this post

    Hi Mattias,

    Moving docks from one RadDockLayout to another is not supported. Please, reorganize your application so that the RadDockLayout wraps all the docks and zones present on the page.

    Best wishes,
    Pero
    the Telerik team

    Register for the Q2 2011 What's New Webinar Week. Mark your calendar for the week starting July 18th and book your seat for a walk through of all the exciting stuff we will ship with the new release!

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