Dynamic Dock UserCtrl Wrappers

[Chris]

Hello,

I'm wanting to do something a little different with dynamic rad dock creation. I currently have a place holder that I'm dynamically loading user controls into (which is within an Update Panel) and I'd like to wrap each of those user controls within a RadDock control. The end result is my users can reorder the user controls which would trigger the Dock's AutoPostback trigger for a position/index change.

So I don't care about the dock's "dock position state", as I keep track of the ordered list in my own format, and that's currently what your dynamic dock examples concentrates on.

In short, I'd like to have a dock layout with one dock zone, and dynamically add a dock control with a user control within it. I'll simply be looping through the list of user controls to add (within a List<t>) to determine the number of docks and user controls to add. Would you have a VB example of anything like that? An example that doesn't use the state property bag to reload the docks? An example essentially manually adding docks to a dockzone without use of a statebag.

In the meantime, I'll continue to play with your dynamic 'dock state examples' to see if can't rework them for my needs.

Thanks!
Chris

[Valeri Hristov]

Hi Chris,

Please, find attached the requested example. Note that it runs with the latest available build (from today) of "Prometheus", which could be downloaded from this forum thread:
http://www.telerik.com/community/forums/thread/b311D-mkedd.aspx

Let me know if you need more help.

Kind regards,
Valeri Hristov (Senior Developer, MCSD)
the Telerik team

Instantly find answers to your questions at the new Telerik Support Center

[Chris]

Valeri,

Thanks for the reply. Your sample code seems overly complex for something that should be so simple. The reason I, and I suspect others, purchase third-party controls is because we generally don't have the time or resources to build the controls ourselves. So when a control I've purchased requires me to use a lot of javascript, I figure why did I bother buying the control - I might as well build my own web control if I have to dig through and hook up a bunch of javascript. The majority of .NET developers are used to dealing with server side events that make things nice and easy. So it's nice bonus having the client events, but the server side events are generally the core and most used of .net framework ctrls in my experience.

As to the code you sent - It seems odd that I simply can't add a zone control to a layout, then be able to add a dock to a zone, and then add any controls to the dock - the coding pattern used by all of the other .NET framework controls.

Meaning: layout.add(zone1) and zone1.add(dock1) and dock1.controls.add(myPlaceholderCtrl1) and then finally on a hypothetical DockItemDataBind server event I can reference that placeholder and then add whatever I want to that.
This is the process that occurs with any kind of 'list/collection' based object with a 'ContentTemplate', such as datalist, datagrid, repeater, and gridview. Your dock control is a collection of items that also has uses a 'ContentTemplate', it seems only natural that the server side events follow the patterns set by Microsoft's controls.

Anyway, while I'm not happy with the overuse of client side events in place of server side and seemly non-standard server side event model, I will say that I am happy with the end result that occurs with Telerik controls. As for my current needs, the ASP.NET AJAX Toolkit's Reorderlist control is a better fit. 

Thanks a lot for your time and if you could, please pass on my complaint/recommendations to the 'Prometheus' project manager.

Chris

[Valeri Hristov]

Hello Chris,

I feel that I should explain why we decided to have ContentTemplate and TitleBarTemplate properties in RadDock:
RadDock has two "areas" where you could add controls - its titlebar and its content area. The rest of the control cannot be modified in design time and that's why we added two templates, despite that the control is not databound. We also had to support a collection property - Commands, along with the two "content" zones in the control. The Framework has at least two similar controls: UpdatePanel and Login - both of them are not databound, have templates for their content and the UpdatePanel has Triggers collection. This approach could be very handy when implementing design mode and the ASPX markup becomes very clear and understandable.

Regarding the example: you asked for modification of the "Dynamic Docks" example, which does not use DockState objects. Please, correct me if I misunderstood you.

If you just want to have something like this:
<DockLayout>
    <UpdatePanel>
        <DockZone>
            dynamically added docks

and simply refresh the UpdatePanel when a new dock is added, or when the user rearranges the docks, you could easily achieve it without any javascript. However, the so called "portal site" scenario, which we designed RadDock for, makes the above approach quite inefficient, because the UpdatePanel will refresh all of its content on AJAX callback.

In two words, you could use RadDock as a regular Panel control, without any use of its client-side events, for example:
<form id="form1" runat="server">
 <div>
  <asp:scriptmanager runat="server" id="ScriptManager1">
  </asp:scriptmanager>
  <telerik:raddocklayout runat="server" id="RadDockLayout1">
   <asp:updatepanel runat="server" id="UpdatePanel1">
    <contenttemplate>
     <telerik:raddockzone runat="server" id="ZoneList">
     </telerik:raddockzone>
     <div>
      <asp:label runat="server" id="LabelOrder"></asp:label>
     </div>
    </contenttemplate>
   </asp:updatepanel>
  </telerik:raddocklayout>
 </div>
</form>

Imports Telerik.Web.UI

Partial Class ReorderList_Default
 Inherits System.Web.UI.Page
 Protected Overrides Sub OnInit(ByVal e As System.EventArgs)
  For i As Integer = 1 To 5
   Dim dock As New RadDock
   dock.ID = String.Format("Dock{0}", i)
   dock.Text = i
   dock.Tag = i
   dock.DockMode = DockMode.Docked
   dock.AutoPostBack = True
   ZoneList.Controls.Add(dock)
  Next
  MyBase.OnInit(e)
 End Sub

 'NOTE: If you are using a version prior 2007.01.0612.0 you should put the 
 ' following code in PreRender or other event, which is raised after Load
 Protected Sub Page_Load(ByVal sender As Object, ByVal e As System.EventArgs) Handles Me.Load
  LabelOrder.Text = "<br/>"
  For Each dock As RadDock In ZoneList.Docks
   LabelOrder.Text += String.Format("{0}<br/>", dock.Tag)
  Next
 End Sub
End Class

Greetings,

Valeri Hristov (Senior Developer, MCSD)
the Telerik team

Instantly find answers to your questions at the new Telerik Support Center

[Chris]

Valeri,

I guess the question could be simplified down to the following based on your latest post. Given your example code:

For i As Integer = 1 To 5
   Dim dock As New RadDock
   dock.ID = String.Format("Dock{0}", i)
   dock.Text = i
   dock.Tag = i
   dock.DockMode = DockMode.Docked
   dock.AutoPostBack = True
   ZoneList.Controls.Add(dock)
Next

At what point can I actually load the user control into the Dock (as if it were a placeholder control)?

So, something to the effect of...

For each myCtrl As MyUserCtrlInfoObject in MyListOfUserCtrls
   Dim dock As New RadDock
   dock.ID = "Dock " & myCtrl.ID
   dock.Text = myCtrl.Name

   dock.controls.add(LoadControl(myCtrl.URL)) 'NEW 
   'OR THIS?
   dock.ContentContainer.Controls.Add(LoadControl(myCtrl.URL)) 'NEW

   'WOULDN'T I ALSO WANT TO WIRE UP DOCK SERVER-SIDE EVENT?
   AddHandler dock.DockPositionChanged, AddressOf dock_DockPositionChanged

   dock.DockMode = DockMode.Docked
   dock.AutoPostBack = True
   ZoneList.Controls.Add(dock)
Next

This above is actually the very first thing I tried (trying to add ctrl to the contentcontainer) to no avail.

So hopefully the example above will give you an idea of what I'm trying to do. Again, I don't care about the dock state because when the 'DockPositionChanged' event is triggered, I update my 'SortOrder' table column based on the new index and retrieve the updated list of user controls (sorted on that column) and rebuild the user ctrl list.

On a side note, to get the ASP.NET AJAX Toolkit's ReOrderlist to work, I had to first bind the list with my collection of custom objs, even though the <ItemTemplate> only had a placeholder control and the URL for the user control. Then in the ItemDataBound event I would actually load each user control into the placeholder for each row. So the 'ReOrderlist' required an indirect approach, while it seems like your Docks control should allow the same 'direct approach' I used simply to load the User Controls into a placeholder.

Thanks,
Chris

[Valeri Hristov]

Hi Chris,

You could add the user controls to RadDock using code, similar to your second suggestion:
dock.ContentContainer.Controls.Add(LoadControl(myCtrl.URL))

it would be the best if you create / load all controls in Page_Init to ensure that their events will be properly raiseed.

It is not necessary to handle DockPositionChanged if you get the positions as in my sample. This event is called before the RadDock control is actually "moved" on the server - it is intended to notify the RadDockLayout to "move" the dock. The AutoPostBack property is true only to notify the application to update the dock positions.

Regarding the different usage of the Tooklit's reorder list and RadDock - RadDock is intended to be used for creating page layout and that's why it is not a databound control. Generally speaking, if Toolkit's ReorderList is DataList or Repeater, RadDock is a Panel.

Regards,
Valeri Hristov (Senior Developer, MCSD)
the Telerik team

Instantly find answers to your questions at the new Telerik Support Center

[Chris]

Valeri,

Well I gave up on the AJAX Toolkit's Reorder list control because of performance issues and I'm now back to trying to get the Dock control to work. I've actually made significant headway with the example code you provided.

I have two issues, both of which merit a different thread as they're slightly different topics (although still related to dynamically loaded userctrls in a dock).

The issues/threads you'll find are:
- Dock Custom Statebag Updating Issue on DockPositionChanged
- Dynamic Dock problems with multiple Update Panels

Thanks,
Chris