DockCommand as a RadAjaxManager trigger

[Jerome MAILLEY]

Hi,

 

I'm using in a web application RadDock control. However I'm trying to figure out if it is possible to use DockCommand as a RadAjaxManager trigger. Because DockCommand has no ID it seems very hard to achieve this.

 

My application scenario is quite easy to understand. The dock command button must load a user control in a panel (ExtendedViewPanel) and then reload it. Please consider the following code :

 

        <telerik:RadAjaxManager ID="RadAjaxManager1" runat="server">
            <AjaxSettings>
                <telerik:AjaxSetting AjaxControlID="MyDockCommand">
                    <UpdatedControls>
                        <telerik:AjaxUpdatedControl ControlID="ExtendedViewPanel" />
                    </UpdatedControls>
                </telerik:AjaxSetting>
            </AjaxSettings>
        </telerik:RadAjaxManager>
            <telerik:RadDockLayout runat="server" ID="RadDockLayout1">
                <table style="width:100%">
                    <tr>
                        <td>
                            <telerik:RadDockZone runat="server" ID="RadDockZone1" Orientation="Horizontal" Style="border: 0;">
                                <telerik:RadDock RenderMode="Lightweight" ID="RadDock1" runat="server" Title="Classeurs non publiés"
                                    EnableAnimation="true" CssClass="higherZIndex" Width="33%" Skin="Metro" OnCommand="RadDock1_Command">
                                    <Commands>
                                        <telerik:DockToggleCommand Name="SwitchView" AutoPostBack="true" CssClass="command-maximize"/>
                                    </Commands>
                                    <ContentTemplate>
                                        <div>
                                            <widget:LastModifiedWorkbook ID="LastModifiedWorkbookControl" runat="server" />
                                            <asp:HiddenField runat="server" ID="toggleState" />
                                        </div>
                                    </ContentTemplate>
                                </telerik:RadDock>
                            </telerik:RadDockZone>
                        </td>
                    </tr>
                </table>
            </telerik:RadDockLayout>
<asp:Panel runat="server" ID="ExtendedViewPanel" CssClass="extended-view-panel" Visible="false">
</asp:Panel>

[Jerome MAILLEY]

Moreover, I'm facing a second issue. I said in my previous post that the dock command button must add a user control in the ExtendedViewPanel. In fact the control which is loaded is a RadTreeList :

protected void RadDock1_Command(object sender, Telerik.Web.UI.DockCommandEventArgs e) {
     RadTreeList treeList = new RadTreeList();
     // Set treelist properties
     ExtendedViewPlaceHolder.Controls.Add(treeList);
}

 

But it seems that the TreeList does not work perfectly. I read in your documentation that "Create the RadTreeList entirely in code-behind - here you should place all the code in the Page_Init event handler". So my question is :

In my application scenario, how may I place this code in the Page_Init event while it must be triggered by a command click ?

 

Thanks,

[Marin Bratanov]

Hi Jerome,

The dock command can trigger a postback and it can fire the server Command event of the dock: https://docs.telerik.com/devtools/aspnet-ajax/controls/dock/server-side-programming/events/command. That, however, will be difficult to ajax-enable whjen the dock is floating, and will also be a postback event that is much later than Page_Init.

So, I suggest you handle the command on the client and invoke a postback from a dummy hidden button that you can easily identify in Page_Init. For example:

<telerik:RadAjaxManager runat="server" ID="ram1">
    <AjaxSettings>
        <telerik:AjaxSetting AjaxControlID="dummyButton">
            <UpdatedControls>
                <telerik:AjaxUpdatedControl ControlID="ExtendedViewPanel" />
            </UpdatedControls>
        </telerik:AjaxSetting>
    </AjaxSettings>
</telerik:RadAjaxManager>

<telerik:RadDock runat="server" ID="dock1">
    <Commands>
        <telerik:DockCommand AutoPostBack="false" OnClientCommand="OnClientCommand" Name="myCustomCommand" />
    </Commands>
</telerik:RadDock>

<telerik:RadCodeBlock runat="server" ID="rcb1">
    <script>
        function OnClientCommand(sender, args) {
            if (args.command.get_name() == "myCustomCommand") {
                __doPostBack("<%=dummyButton.UniqueID%>", "");//simulate a click on the dummy button because it is easier to distinguish
                //see more here https://www.telerik.com/support/kb/aspnet-ajax/details/determine-postback-control-or-ajax-request-initiator
            }
        }
    </script>
</telerik:RadCodeBlock>

<asp:Panel runat="server" ID="ExtendedViewPanel">
    <asp:Button Text="dummy button" ID="dummyButton" Style="display: none;" runat="server" />
</asp:Panel>

and on the server

protected void Page_Init(object sender, EventArgs e)
{
    string postbackInitiatorID = Request.Params["__EVENTTARGET"];
    if (!string.IsNullOrWhiteSpace(postbackInitiatorID) && postbackInitiatorID.Contains("dummyButton"))
    {
        //add treelist here, and do that on every subsequent postback
    }
}

Regards,
Marin Bratanov
Progress Telerik