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

RadDockLayout, RadZones, RadDock, User-Control, AJAX in Code-Behind

2 Answers 199 Views

Dock

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

NMQA asked on 17 May 2014, 09:58 PM

Hi Telerik Team,

My goal is to create a RadDockLayout, RadZones and several RadDocks dynamically. Additionally my RadDocks' content are user-controls that I am dynamically loading at run-time. And all the controls mentioned are wrapped into Update Panels.

What I want to achieve is to have no RadControls defined in the Code In-Front and rather have everything in the code-behind (C#).

My problem is that my controls are disappearing on subsequent post-back (which are initiated by my user-controls). I am aware that I need to re-create the controls on the Page_Load(), but no luck.

WORKING VERSION

01.<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="AA.aspx.cs" Inherits="Dashboard.AA" %>

02.

03.<%@ Register TagPrefix="telerik" Namespace="Telerik.Web.UI" Assembly="Telerik.Web.UI" %>

04.<!DOCTYPE html>

05.

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

07.<head runat="server">

08. <title></title>

09.

10.</head>

11.<body>

12. <form id="form1" runat="server">

13. <asp:ScriptManager ID="scriptManager" runat="server"></asp:ScriptManager>

14. <asp:Button ID="btnAddWidget" Text="Add Signs Widget" OnClick="btnAddWidget_Click" runat="server" />

15. <asp:Button ID="btnAddTimer" Text="Add Timer Widget" OnClick="btnAddTimer_Click" runat="server" />

16. <asp:UpdatePanel runat="server" ID="UpdatePanel2" ChildrenAsTriggers="false" UpdateMode="Conditional">

17. <ContentTemplate>

18. <telerik:RadDockLayout runat="server" ID="RadDockLayout1" OnSaveDockLayout="RadDockLayout1_SaveDockLayout"

19. OnLoadDockLayout="RadDockLayout1_LoadDockLayout">

20. <table cellpadding="0" cellspacing="0" width="100%">

21. <tr>

22. <td style="width: 50%; vertical-align: top">

23. <telerik:RadDockZone runat="server" BackColor="#fbfbfb" BorderStyle="Dotted" ID="RadDockZone1" MinWidth="300" Width="98%" MinHeight="300">

24. </telerik:RadDockZone>

25. </td>

26. <td style="width: 50%; vertical-align: top">

27. <telerik:RadDockZone runat="server" BorderStyle="Dotted" ID="RadDockZone2" MinWidth="300" Width="100%" MinHeight="300">

28. </telerik:RadDockZone>

29. </td>

30. </tr>

31. </table>

32. </telerik:RadDockLayout>

33. </ContentTemplate>

34. <Triggers>

35. <asp:AsyncPostBackTrigger ControlID="btnAddWidget" EventName="Click"></asp:AsyncPostBackTrigger>

36. <asp:AsyncPostBackTrigger ControlID="btnAddTimer" EventName="Click"></asp:AsyncPostBackTrigger>

37. </Triggers>

38. </asp:UpdatePanel>

39.

40. </form>

41.</body>

42.</html>

001.using System;

002.using System.Collections.Generic;

003.using System.Web.UI;

004.using System.Web.UI.WebControls;

005.using Telerik.Web.UI;

006.

007.namespace Dashboard

008.{

009. public partial class AA : System.Web.UI.Page

010. {

011. private const bool DockStateCleared = false;

012.

013. private List<DockState> CurrentDockStates

014. {

015. get

016. {

017. //Store the info about the added docks in the session. For real life

018. // applications we recommend using database or other storage medium

019. // for persisting this information.

020. List<DockState> _currentDockStates = (List<DockState>)Session["CurrentDockStatesMyPortal"];

021. if (Object.Equals(_currentDockStates, null))

022. {

023. _currentDockStates = new List<DockState>();

024. Session["CurrentDockStatesMyPortal"] = _currentDockStates;

025. }

026. return _currentDockStates;

027. }

028. set

029. {

030. Session["CurrentDockStatesMyPortal"] = value;

031. }

032. }

033.

034. private RadDock CreateRadDockFromState(DockState state)

035. {

036. RadDock dock = new RadDock();

037. dock.DockMode = DockMode.Docked;

038. dock.ID = string.Format("RadDock{0}", state.UniqueName);

039. dock.ApplyState(state);

040. dock.Commands.Add(new DockCloseCommand());

041. //dock.Commands.Add(new DockExpandCollapseCommand());

042.

043. return dock;

044. }

045.

046. protected void Page_Init(object sender, EventArgs e)

047. {

048. //Recreate the docks in order to ensure their proper operation

049. for (int i = 0; i < CurrentDockStates.Count; i++)

050. {

051. // clears the closed docks from the dock state, this line is

052. // optional and its purpose is to keep the dock state as small

053. // as possible

054. if (CurrentDockStates[i].Closed == true) continue;

055.

056. RadDock dock = CreateRadDockFromState(CurrentDockStates[i]);

057. //We will just add the RadDock control to the RadDockLayout.

058. // You could use any other control for that purpose, just ensure

059. // that it is inside the RadDockLayout control.

060. // The RadDockLayout control will automatically move the RadDock

061. // controls to their corresponding zone in the LoadDockLayout

062. // event (see below).

063. RadDockLayout1.Controls.Add(dock);

064. //We want to save the dock state every time a dock is moved.

065. CreateSaveStateTrigger(dock);

066. //Load the selected widget

067. LoadWidget(dock);

068.

069. // prevents the rendering of closed docks, used for improving

070. // performance

071. if (CurrentDockStates[i].Closed == true)

072. {

073. dock.Visible = false;

074. }

075. }

076. }

077.

078. protected void Page_Load(object sender, EventArgs e)

079. {

080.

081. }

082.

083. protected void RadDockLayout1_LoadDockLayout(object sender, Telerik.Web.UI.DockLayoutEventArgs e)

084. {

085. //Populate the event args with the state information. The RadDockLayout control

086. // will automatically move the docks according that information.

087. foreach (DockState state in CurrentDockStates)

088. {

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

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

091. }

092. }

093.

094. protected void RadDockLayout1_SaveDockLayout(object sender, Telerik.Web.UI.DockLayoutEventArgs e)

095. {

096. if (!DockStateCleared)

097. {

098. //Save the dock state in the session. This will enable us

099. // to recreate the dock in the next Page_Init.

100. CurrentDockStates = RadDockLayout1.GetRegisteredDocksState();

101. }

102. else

103. {

104. //the clear state button was clicked, so we refresh the page and start over.

105. Response.Redirect(Request.RawUrl, false);

106. }

107. }

108.

109. protected void btnAddWidget_Click(object sender, EventArgs e)

110. {

111. AddWidget("SimpleUserControl");

112. }

113.

114. private void AddWidget(string widgetName)

115. {

116. RadDock radDock = CreateRadDock();

117. //find the target zone and add the new dock there

118. RadDockZone radDockZone = RadDockZone2; //(RadDockZone)this.Master.FindControl("ContentPlaceHolder1").FindControl(DropDownZone.SelectedItem.Text);

119.

120. //adding the dock to the dock layout and then docking it to the zone to avoid ViewState issues on subsequent postback

121. RadDockLayout1.Controls.Add(radDock);

122. radDock.Dock(radDockZone);

123.

124. CreateSaveStateTrigger(radDock);

125.

126. // Ensure that the dock is opened, should be used when closed docks are

127. // cleared from the dock state on Page_Init

128. radDock.Closed = false;

129.

130. //Load the selected widget in the RadDock control

131. radDock.Tag = widgetName;

132. LoadWidget(radDock);

133. }

134.

135. private void LoadWidget(RadDock dock)

136. {

137. if (string.IsNullOrEmpty(dock.Tag) || dock.Closed)

138. {

139. return;

140. }

141.

142. Control widget = null;

143. switch (dock.Tag)

144. {

145. case "SimpleUserControl":

146. {

147. SimpleControl horoscopeControl = new SimpleControl();

148. horoscopeControl.ID = "myHoros";

149. widget = horoscopeControl;

150. }

151. break;

152. case "MyTimerControl":

153. {

154. Timer timerControl = new Timer();

155. timerControl.ID = "coolTimer";

156. widget = timerControl;

157. }

158. break;

159. }

160. if (widget != null)

161. {

162. dock.ContentContainer.Controls.Add(widget);

163. }

164. }

165.

166. private void CreateSaveStateTrigger(RadDock dock)

167. {

168. //Ensure that the RadDock control will initiate postback

169. // when its position changes on the client or any of the commands is clicked.

170. //Using the trigger we will "ajaxify" that postback.

171. dock.AutoPostBack = true;

172. dock.CommandsAutoPostBack = true;

173.

174. AsyncPostBackTrigger saveStateTrigger = new AsyncPostBackTrigger();

175. saveStateTrigger.ControlID = dock.ID;

176. saveStateTrigger.EventName = "DockPositionChanged";

177. UpdatePanel2.Triggers.Add(saveStateTrigger);

178.

179. saveStateTrigger = new AsyncPostBackTrigger();

180. saveStateTrigger.ControlID = dock.ID;

181. saveStateTrigger.EventName = "Command";

182. UpdatePanel2.Triggers.Add(saveStateTrigger);

183. }

184.

185. private RadDock CreateRadDock()

186. {

187. RadDock dock = new RadDock();

188. dock.DockMode = DockMode.Docked;

189. dock.UniqueName = Guid.NewGuid().ToString().Replace("-", "a");

190. dock.ID = string.Format("RadDock{0}", dock.UniqueName);

191. dock.Title = "Dock";

192. dock.Text = string.Format("Added at {0}", DateTime.Now);

193. dock.Width = Unit.Pixel(100);

194. dock.Height = Unit.Pixel(400);

195. dock.Commands.Add(new DockCloseCommand());

196. //dock.Commands.Add(new DockExpandCollapseCommand());

197.

198. return dock;

199. }

200.

201. protected void btnAddTimer_Click(object sender, EventArgs e)

202. {

203. AddWidget("MyTimerControl");

204. }

205. }

206.}

User-Controls

01.using System;

02.using System.Collections.Generic;

03.using System.Web.UI;

04.using System.Web.UI.WebControls;

05.

06.namespace Dashboard

07.{

08. public partial class SimpleControl : System.Web.UI.UserControl

09. {

10. public List<string> SignList

11. {

12. get

13. {

14. var signList = new List<string>();

15. signList.Add("Virgo");

16. signList.Add("Libra");

17. signList.Add("Scorpio");

18. signList.Add("Tauro");

19. return signList;

20. }

21. }

22.

23. protected void Page_Init(object sender, EventArgs e)

24. {

25. //Drop Down List

26. DropDownList ddlHoroscope = new DropDownList();

27. ddlHoroscope.ID = "DropDownSigns";

28. ddlHoroscope.EnableViewState = false;

29. ddlHoroscope.AutoPostBack = true;

30. ddlHoroscope.Width = Unit.Pixel(180);

31. ddlHoroscope.SelectedIndexChanged += ddlHoroscope_SelectedIndexChanged;

32. ddlHoroscope.DataSource = SignList;

33. ddlHoroscope.DataBind();

34. ddlHoroscope.SelectedIndex = 0;

35. this.Controls.Add(ddlHoroscope);

36.

37. //Literal

38. Literal horoscopeLiteral = new Literal();

39. horoscopeLiteral.ID = "Horoscope";

40. this.Controls.Add(horoscopeLiteral);

41.

42. //Update Panel

43. UpdatePanel updatePanelHoros = new UpdatePanel();

44. updatePanelHoros.ID = "UpdatePanelHoroscopes";

45. updatePanelHoros.UpdateMode = UpdatePanelUpdateMode.Conditional;

46. updatePanelHoros.ContentTemplateContainer.Controls.Add(horoscopeLiteral);

47. AsyncPostBackTrigger trigger = new AsyncPostBackTrigger();

48. trigger.ControlID = ddlHoroscope.UniqueID;

49. trigger.EventName = "SelectedIndexChanged";

50. updatePanelHoros.Triggers.Add(trigger);

51. this.Controls.Add(updatePanelHoros);

52. }

53.

54. protected void Page_Load(object sender, EventArgs e)

55. {

56. if (!IsPostBack)

57. {

58.

59. }

60. DisplayHoroscope();

61. }

62.

63. private void DisplayHoroscope()

64. {

65. var horosLabel = this.FindControl("Horoscope") as Literal;

66. var horosDDL = this.FindControl("DropDownSigns") as DropDownList;

67. if (horosLabel != null && horosDDL != null)

68. {

69. horosLabel.Text = horosDDL.SelectedItem.Text;

70. }

71. }

72.

73. void ddlHoroscope_SelectedIndexChanged(object sender, EventArgs e)

74. {

75. DisplayHoroscope();

76. }

77. }

78.}

01.using System;

02.using System.Web.UI;

03.using System.Web.UI.WebControls;

04.

05.namespace Dashboard

06.{

07. public partial class Timer : System.Web.UI.UserControl

08. {

09.

10. protected void Page_Init(object sender, EventArgs e)

11. {

12. System.Web.UI.Timer myTimer = new System.Web.UI.Timer();

13. myTimer.ID = "Timer1";

14. myTimer.Interval = 1000;

15. myTimer.Tick += myTimer_Tick;

16. this.Controls.Add(myTimer);

17.

18. Label myLabel = new Label();

19. myLabel.ID = "lblTime";

20. this.Controls.Add(myLabel);

21.

22. //Update Panel

23. UpdatePanel updatePanelTimer = new UpdatePanel();

24. updatePanelTimer.ID = "UpdatePanelTimer";

25. updatePanelTimer.UpdateMode = UpdatePanelUpdateMode.Conditional;

26. updatePanelTimer.ContentTemplateContainer.Controls.Add(myTimer);

27. updatePanelTimer.ContentTemplateContainer.Controls.Add(myLabel);

28. this.Controls.Add(updatePanelTimer);

29. }

30.

31. void myTimer_Tick(object sender, EventArgs e)

32. {

33. DisplayTime();

34. }

35.

36. private void DisplayTime()

37. {

38. var timerLabel = this.FindControl("lblTime") as Label;

39. if (timerLabel != null)

40. {

41. timerLabel.Text = "Panel refreshed at: " + DateTime.Now.ToLongTimeString();

42. }

43. }

44.

45. protected void Page_Load(object sender, EventArgs e)

46. {

47. DisplayTime();

48. }

49.

50. }

51.}

NOT WORKING VERSION

01.<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="AA.aspx.cs" Inherits="Dashboard.AA" %>

02.<!DOCTYPE html>

03.

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

05. <head runat="server">

06. <title></title>

07. <style>

08. .myStyle {

09. background: #f5f4e8;

10. float: left;

11. margin-bottom: 20px;

12. margin-right: 70px;

13. }

14.

15. .myStyle2 {

16. background: #d5f0fa;

17. float: left;

18. margin-bottom: 20px;

19. margin-right: 70px;

20. }

21. </style>

22. </head>

23. <body>

24. <form id="form1" runat="server">

25. <asp:ScriptManager ID="scriptManager" runat="server"></asp:ScriptManager>

26. </form>

27. </body>

28.</html>

001.using System;

002.using System.Collections.Generic;

003.using System.Web.UI;

004.using System.Web.UI.WebControls;

005.using Telerik.Web.UI;

006.

007.namespace Dashboard

008.{

009. public partial class AA : Page

010. {

011. private bool _dockStateCleared = false;

012.

013. private AsyncPostBackTrigger _asyncPostBackTriggerAddTimerWidget;

014. private AsyncPostBackTrigger _asyncPostBackTriggerAddWidget;

015.

016. private Button _buttonAddTimer;

017. private Button _buttonAddWidget;

018. private RadDockLayout _radDockLayoutOne;

019. private RadDockZone _radDockZoneOne;

020. private RadDockZone _radDockZoneTwo;

021. private UpdatePanel _updatePanelTwo;

022. private RadDock _radDock;

023.

024. protected void Page_Init(object sender, EventArgs e)

025. {

026. #region Layout

027.

028. _radDockLayoutOne = new RadDockLayout

029. {

030. ID = "RadDockLayout1"

031. };

032.

033. //Layout Events

034. _radDockLayoutOne.SaveDockLayout += _radDockLayoutOne_SaveDockLayout;

035. _radDockLayoutOne.LoadDockLayout += _radDockLayoutOne_LoadDockLayout;

036.

037. // Add Layout to Page

038. form1.Controls.Add(_radDockLayoutOne);

039. #endregion

040.

041. #region Zone

042.

043. // Zone 1

044. _radDockZoneOne = new RadDockZone

045. {

046. ID = "RadDockZone1",

047. BorderStyle = BorderStyle.Dotted,

048. MinWidth = Unit.Pixel(300),

049. Width = Unit.Percentage(98.0),

050. MinHeight = Unit.Pixel(300),

051. CssClass = "myStyle",

052. ToolTip = "Zone 1"

053. };

054. // Add Zone 1 to Page

055. form1.Controls.Add(_radDockZoneOne);

056.

057. // Zone 2

058. _radDockZoneTwo = new RadDockZone

059. {

060. ID = "RadDockZone2",

061. BorderStyle = BorderStyle.Dotted,

062. MinWidth = Unit.Pixel(300),

063. Width = Unit.Percentage(98.0),

064. MinHeight = Unit.Pixel(300),

065. CssClass = "myStyle2"

066. };

067. // Add Zone 2 to Page

068. form1.Controls.Add(_radDockZoneTwo);

069.

070. #endregion

071.

072. #region Buttons

073.

074. // Button Widget

075. _buttonAddWidget = new Button

076. {

077. ID = "btnAddWidget",

078. Text = "Add Signs Control"

079. };

080. _buttonAddWidget.Click += _buttonAddWidget_Click;

081. // Add Button to Page

082. form1.Controls.Add(_buttonAddWidget);

083.

084. //Button Timer

085. _buttonAddTimer = new Button

086. {

087. ID = "btnAddTimer",

088. Text = "Add Timer Control"

089. };

090. _buttonAddTimer.Click += _buttonAddTimer_Click;

091. // Add Button to Page

092. form1.Controls.Add(_buttonAddTimer);

093. #endregion

094.

095. #region Update Panel

096.

097. _updatePanelTwo = new UpdatePanel

098. {

099. ID = "UpdatePanel2",

100. ChildrenAsTriggers = false,

101. UpdateMode = UpdatePanelUpdateMode.Conditional

102. };

103. _updatePanelTwo.ContentTemplateContainer.Controls.Add(_radDockLayoutOne);

104. _updatePanelTwo.ContentTemplateContainer.Controls.Add(_radDockZoneOne);

105. _updatePanelTwo.ContentTemplateContainer.Controls.Add(_radDockZoneTwo);

106.

107. _asyncPostBackTriggerAddTimerWidget = new AsyncPostBackTrigger

108. {

109. ControlID = _buttonAddWidget.UniqueID,

110. EventName = "Click"

111. };

112. _updatePanelTwo.Triggers.Add(_asyncPostBackTriggerAddTimerWidget);

113.

114. _asyncPostBackTriggerAddWidget = new AsyncPostBackTrigger

115. {

116. ControlID = _buttonAddTimer.UniqueID,

117. EventName = "Click"

118. };

119. _updatePanelTwo.Triggers.Add(_asyncPostBackTriggerAddWidget);

120. _updatePanelTwo.Update();

121. form1.Controls.Add(_updatePanelTwo);

122.

123. #endregion

124.

125.

126.

127. }

128.

129. protected void Page_Load(object sender, EventArgs e)

130. {

131. #region Recreate the docks in order to ensure their proper operation

132. //Recreate the docks in order to ensure their proper operation

133. for (int i = 0; i < CurrentDockStates.Count; i++)

134. {

135. // clears the closed docks from the dock state, this line is

136. // optional and its purpose is to keep the dock state as small

137. // as possible

138. if (CurrentDockStates[i].Closed == true) continue;

139.

140. RadDock dock = CreateRadDockFromState(CurrentDockStates[i]);

141. //We will just add the RadDock control to the RadDockLayout.

142. // You could use any other control for that purpose, just ensure

143. // that it is inside the RadDockLayout control.

144. // The RadDockLayout control will automatically move the RadDock

145. // controls to their corresponding zone in the LoadDockLayout

146. // event (see below).

147. _radDockLayoutOne.Controls.Add(dock);

148. //We want to save the dock state every time a dock is moved.

149. CreateSaveStateTrigger(dock);

150. //Load the selected widget

151. LoadWidget(dock);

152.

153. // prevents the rendering of closed docks, used for improving

154. // performance

155. if (CurrentDockStates[i].Closed == true)

156. {

157. dock.Visible = false;

158. }

159. }

160. #endregion

161.

162. }

163.

164. void _buttonAddTimer_Click(object sender, EventArgs e)

165. {

166. AddWidget("MyTimerControl");

167. }

168.

169. void _buttonAddWidget_Click(object sender, EventArgs e)

170. {

171. AddWidget("SimpleUserControl");

172. }

173.

174. void _radDockLayoutOne_LoadDockLayout(object sender, DockLayoutEventArgs e)

175. {

176. //Populate the event args with the state information. The RadDockLayout control

177. // will automatically move the docks according that information.

178. foreach (DockState state in CurrentDockStates)

179. {

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

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

182. }

183. }

184.

185. void _radDockLayoutOne_SaveDockLayout(object sender, DockLayoutEventArgs e)

186. {

187. if (!_dockStateCleared)

188. {

189. //Save the dock state in the session. This will enable us

190. // to recreate the dock in the next Page_Init.

191. if (_radDockLayoutOne != null) CurrentDockStates = _radDockLayoutOne.GetRegisteredDocksState();

192. }

193. else

194. {

195. //the clear state button was clicked, so we refresh the page and start over.

196. Response.Redirect(Request.RawUrl, false);

197. }

198. }

199.

200. private List<DockState> CurrentDockStates

201. {

202. get

203. {

204. //Store the info about the added docks in the session. For real life

205. // applications we recommend using database or other storage medium

206. // for persisting this information.

207. var currentDockStates = (List<DockState>) Session["CurrentDockStatesMyPortal"];

208. if (Equals(currentDockStates, null))

209. {

210. currentDockStates = new List<DockState>();

211. Session["CurrentDockStatesMyPortal"] = currentDockStates;

212. }

213. return currentDockStates;

214. }

215. set { Session["CurrentDockStatesMyPortal"] = value; }

216. }

217.

218. private RadDock CreateRadDockFromState(DockState state)

219. {

220. var dock = new RadDock

221. {

222. DockMode = DockMode.Docked,

223. ID = string.Format("RadDock{0}", state.UniqueName)

224. };

225. dock.ApplyState(state);

226. dock.Commands.Add(new DockCloseCommand());

227. //dock.Commands.Add(new DockExpandCollapseCommand());

228.

229. return dock;

230. }

231.

232. private void AddWidget(string widgetName)

233. {

234. _radDock = CreateRadDock();

235. //find the target zone and add the new dock there

236. RadDockZone radDockZone = _radDockZoneTwo;

237. //(RadDockZone)this.Master.FindControl("ContentPlaceHolder1").FindControl(DropDownZone.SelectedItem.Text);

238.

239. //adding the dock to the dock layout and then docking it to the zone to avoid ViewState issues on subsequent postback

240. if (_radDockLayoutOne != null) _radDockLayoutOne.Controls.Add(_radDock);

241. _radDock.Dock(radDockZone);

242.

243. CreateSaveStateTrigger(_radDock);

244.

245. // Ensure that the dock is opened, should be used when closed docks are

246. // cleared from the dock state on Page_Init

247. _radDock.Closed = false;

248.

249. //Load the selected widget in the RadDock control

250. _radDock.Tag = widgetName;

251. LoadWidget(_radDock);

252. }

253.

254. private void LoadWidget(RadDock dock)

255. {

256. if (string.IsNullOrEmpty(dock.Tag) || dock.Closed)

257. {

258. return;

259. }

260.

261. Control widget = null;

262. switch (dock.Tag)

263. {

264. case "SimpleUserControl":

265. {

266. var horoscopeControl = new SimpleControl();

267. horoscopeControl.ID = "myHoros";

268. widget = horoscopeControl;

269. }

270. break;

271. case "MyTimerControl":

272. {

273. var timerControl = new Timer();

274. timerControl.ID = "coolTimer";

275. widget = timerControl;

276. }

277. break;

278. }

279. if (widget != null)

280. {

281. dock.ContentContainer.Controls.Add(widget);

282. //_updatePanelTwo.ContentTemplateContainer.Controls.Add(dock);

283. }

284. }

285.

286. private void CreateSaveStateTrigger(RadDock dock)

287. {

288. //Ensure that the RadDock control will initiate postback

289. // when its position changes on the client or any of the commands is clicked.

290. //Using the trigger we will "ajaxify" that postback.

291. dock.AutoPostBack = true;

292. dock.CommandsAutoPostBack = true;

293.

294. if (_updatePanelTwo != null)

295. {

296. var saveStateTrigger = new AsyncPostBackTrigger

297. {

298. ControlID = dock.ID,

299. EventName = "DockPositionChanged"

300. };

301. _updatePanelTwo.Triggers.Add(saveStateTrigger);

302.

303. saveStateTrigger = new AsyncPostBackTrigger

304. {

305. ControlID = dock.ID,

306. EventName = "Command"

307. };

308. _updatePanelTwo.Triggers.Add(saveStateTrigger);

309. }

310. }

311.

312. private RadDock CreateRadDock()

313. {

314. var dock = new RadDock

315. {

316. DockMode = DockMode.Docked,

317. UniqueName = Guid.NewGuid().ToString().Replace("-", "a")

318. };

319. dock.ID = string.Format("RadDock{0}", dock.UniqueName);

320. dock.Title = "Dock";

321. dock.Text = string.Format("Added at {0}", DateTime.Now);

322. dock.Width = Unit.Pixel(100);

323. dock.Height = Unit.Pixel(400);

324. dock.Commands.Add(new DockCloseCommand());

325. //dock.Commands.Add(new DockExpandCollapseCommand());

326.

327. return dock;

328. }

329.

330. }

331.}

Can you please have a look and help me out with this issue?

Telerik version: 2012.3.1016.35

Thanks,
Navnit

2 Answers, 1 is accepted

Accepted

answered on 20 May 2014, 02:30 PM

MainPage-Modified.zip

Hi,

There are a few things that need to be changed in order for the example to work correctly:

The region Recreate the docks in order to ensure their proper operation should be moved at the end of the Page_Init event handler. The RadDock controls need to be recreated on Page_Init so that their state is applied correctly.
The RadDockZone controls need to be added in the Controls collection of the RadDockLayout, otherwise the state of the docks inside will not be persisted. Also, you can add them directly in the dock layout without inserting them in the Page first.

I have attached a modified version of the AA.aspx page that includes the changes mentioned above. Please use it as a reference for resolving the problem at hand.

I noticed that you have posted a support ticket about the same issue. I would suggest using only one ticket/support thread for reporting a particular problem so that the information is easier to track. That being said, let us continue our discussion either in the support ticket or in the forum thread.

Regards,
Slav
Telerik

Check out the Telerik Platform - the only platform that combines a rich set of UI tools with powerful cloud services to develop web, hybrid and native mobile apps.

Product Bundles

DevCraft

Web

Mobile

Document Management

Desktop

Reporting & Mocking

Automated Testing

CMS

UI/UX Tools

Debugging

Free Tools

Support and Learning

Productivity and Design Tools

RadDockLayout, RadZones, RadDock, User-Control, AJAX in Code-Behind

2 Answers, 1 is accepted