This is a migrated thread and some comments may be shown as answers.

Dynamic Raddock - inside RadTab/MultipageView

1 Answer 53 Views
Dock
This is a migrated thread and some comments may be shown as answers.
Karthik A
Top achievements
Rank 1
Karthik A asked on 06 Jan 2014, 07:16 AM
Hi,

I am creating a new dashboard page with RadTabstrips and each tabs loading an individual set of Raddocks dynamically (these docks are movable and thier state are saved in the DB).
The issue we are facing while trying to achieve this is since we are loading the Docks dynamically and maintainig its state through docklayout's loadstate and savestate method, we are suppose to add the dock back in Page_Init event.
Also we can get the required dock details from DB based on current selected Tab only but we cannot get the selected tab index in Page_Init. If we get the selected index in page_load and add docks there then the state of the dock is not retained.

Please suggest us a solution here, following are some of the code samples;
Dashboard.aspx:

<telerik:RadTabStrip runat="server" ID="RadTabStrip1" class="Dashboard" Orientation="HorizontalTop" EnableDragToReorder="true" OnTabClick="RadTabStrip1_TabClick" Skin="Outlook" OnReordered="RadTabStrip1_Reordered" MultiPageID="RadMultiPage1" OnClientTabSelecting="onClientTabSelecting" SelectedIndex="0">
                            </telerik:RadTabStrip>
                
       
        <telerik:RadMultiPage class="Dashboard" ID="RadMultiPage1" runat="server" Width="100%" SelectedIndex="0" OnPageViewCreated="RadMultiPage1_PageViewCreated">
            <telerik:RadPageView ID="RadPageView1" runat="server">
                <asp:Panel ID="Panel1" runat="server" BorderStyle="None" Width="100%">
                    <telerik:RadDockLayout runat="server" ID="RadDockLayout1"  OnSaveDockLayout="SaveDockLayout1_LoadDockLayout" StoreLayoutInViewState="true">
                        <telerik:RadDockZone runat="server" ID="LeftZone" BorderStyle="Solid" BorderWidth="0px" BorderColor="White" Width="25%" MinHeight="450px" Style="float: left; margin-right: 1px" Height="100%" Skin="Windows7">
                       
                         
                        </telerik:RadDockZone>
                        <telerik:RadDockZone runat="server" ID="MiddleZone" BorderStyle="Solid" BorderWidth="0px" BorderColor="Gray" Width="47%" MinHeight="450px" Style="float: left; margin-right: 1px" Height="100%" Skin="Windows7">
                       
                        </telerik:RadDockZone>
                        <telerik:RadDockZone runat="server" ID="RightZone" BorderStyle="Solid" BorderWidth="0px" BorderColor="White" Width="25%" MinHeight="450px" Style="float: left; margin-right: 1px" Height="100%" Skin="Windows7">
                        </telerik:RadDockZone>
                        <br style="clear: both;" />
                    </telerik:RadDockLayout>
                </asp:Panel>
            </telerik:RadPageView>
        </telerik:RadMultiPage>

Dashboard.aspx.cs:

protected

 

 

void Page_Init(object sender, EventArgs e)

 

{

RadDockLayout1.LoadDockLayout+=

 

new DockLayoutEventHandler(RadDockLayout1_LoadDockLayout);

 

AddDocksByPosition(0);

 


}

private void AddDefaultDocks(int position)

 

{

/*** Get list of docks from DB and load it to the Docklayout****/
}

protected void RadDockLayout1_LoadDockLayout(object sender, DockLayoutEventArgs e)

 

{

 

System.Web.Script.Serialization.

 

JavaScriptSerializer serializer = new System.Web.Script.Serialization.JavaScriptSerializer();

 

 

 

string serializedList = DockPostionstr;

 

 

 

if (!string.IsNullOrEmpty(serializedList))

 

{

 

 

string[] states = serializedList.Split('|');

 

 

 

foreach (string stringState in states)

 

{

 

 

if (stringState != string.Empty)

 

{

 

 

DockState state = serializer.Deserialize<DockState>(stringState);

 

e.Positions[state.UniqueName] = state.DockZoneID;

e.Indices[state.UniqueName] = state.Index;

}

}

}

}


 

 

 

protected void SaveDockLayout1_LoadDockLayout(object sender, DockLayoutEventArgs e)

 

{

 

 

string dockState;

 

System.Web.Script.Serialization.

 

JavaScriptSerializer serializer = new System.Web.Script.Serialization.JavaScriptSerializer();

 

 

 

List<DockState> stateList = RadDockLayout1.GetRegisteredDocksState();

 

 

 

StringBuilder serializedList = new StringBuilder();

 

 

 

int i = 0;

 

 

 

while (i < stateList.Count)

 

{

serializedList.Append(serializer.Serialize(stateList[i]));

serializedList.Append(

 

"|");

 

i++;

}

dockState = serializedList.ToString();

/***** DB call to save Dashboard state per Tab******/
}

1 Answer, 1 is accepted

Sort by
0
Slav
Telerik team
answered on 08 Jan 2014, 12:52 PM
Hi Karthik,

As mentioned in this help article, the RadDock controls need to be created before the event RadDock.DockPositionChanged. Nevertheless, at this point the changed tab index is not loaded from the ViewState. What you can do is save the selected index on the client, for example in a hidden field ASP.NET control, and retrieve the value on the server.

Another option is to change your implementation so all RadDocks are loaded, regardless of the selected tab. This way all of the docks will be recreated on each postback, however only the ones that are included in the currently displayed page view will be visible.

Regards,
Slav
Telerik
If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the RadControls for ASP.NET AJAX, subscribe to the blog feed now.
Tags
Dock
Asked by
Karthik A
Top achievements
Rank 1
Answers by
Slav
Telerik team
Share this question
or