ajaxRequest event is fired but, panel is not updated

[Roger]

I have an "Explorer" style page with a treeview in the left pane and a detail pane on the right. I have quite a bit of functionality in the page, and it all seems to be working well, except for one scenario that I am trying to get to work.

The information in the Detail pane is created using XSLT. Some of the information is in the form of hyperlinks. I am using the onclick event of the anchor tags to trigger an event in javascript that will load the target information sent by the anchor into the detail pane. So, when the user clicks a hyperlink in the detail pane, the new page will load in the detail pane. I am using the onclick event to do this because controls created via Javascript cannot fire the server side events.

Anyway, all my code is working correctly. When the hyperlink is clicked, the javascript event fires and calls the explicitCallBack code in my example below. That code calls back to the server, and my server code calls to the database, gets the new data, and loads the new controls, all without error. But, the detail pane does not display the new data. It seems that I must expressly "refresh" the detail pane. Is that correct? And, if it is correct, how do I do that?

I will include the basic structure of the relevant part of my aspx page:

<telerik:RadCodeBlock ID="ExplorerCodeBlock" runat="server">
    <script language="javascript" type="text/javascript" src="scripts/editPage.js"></script>
    <script type="text/javascript">
    //<![CDATA[
    function handleHyperlink(target) {
        /* ... do some processing... */
        explicitCallBack(target);
    }

    function explicitCallBack(arg) {
        var ajaxManager = $find("<%= RadAjaxManager1.ClientID %>");
        ajaxManager.ajaxRequest(arg);
    }
    //]]>
    </script>
</telerik:RadCodeBlock>

<telerik:RadAjaxManager ID="RadAjaxManager1" OnAjaxRequest="RadAjaxManager1_AjaxRequest" runat="server">
    <AjaxSettings>
        <telerik:AjaxSetting AjaxControlID="tvExplorer">
            <UpdatedControls>
                <telerik:AjaxUpdatedControl ControlID="tvExplorer" />
                <telerik:AjaxUpdatedControl ControlID="pnlDetailWrapper" />
            </UpdatedControls>
        </telerik:AjaxSetting>
        <telerik:AjaxSetting AjaxControlID="pnlDetailWrapper">
            <UpdatedControls>
                <telerik:AjaxUpdatedControl ControlID="pnlDetailWrapper" />
            </UpdatedControls>
        </telerik:AjaxSetting>
    </AjaxSettings>
</telerik:RadAjaxManager>
<telerik:RadSplitter ID="RadSplitter1" CssClass="grid_12" Height="650" Width="100%" LiveResize="true"  runat="server">
    <telerik:RadPane ID="paneExplorer" CssClass="grid_6 alpha" runat="server">
        <telerik:RadTreeView ID="tvExplorer" runat="server" TabIndex="1" AccessKey="m"
          OnClientNodeClicked="OnClientNodeClicked"
          OnClientKeyPressing="OnClientKeyPressing"
          OnClientNodeDataBound="OnClientNodeDataBound"
          OnClientContextMenuItemClicking="OnClientContextMenuItemClicking"
          OnContextMenuItemClick="tvExplorer_ContextMenuItemClick"
          OnNodeClick="tvExplorer_NodeClick">
            <WebServiceSettings Path="DataSvcProxy.asmx" Method="GetRadTreeViewNodes" />
            <Nodes>
                <telerik:RadTreeNode runat="server" Text="My Project" Value="0" ClassID="0" PermClasses="0" ExpandMode="WebService" />
            </Nodes>
        </telerik:RadTreeView>
    </telerik:RadPane>
    <telerik:RadSplitBar ID="RadSplitBar1" CollapseMode="Forward" runat="server" />
    <telerik:RadPane ID="paneDetail" CssClass="grid_6 omega" runat="server">
        <asp:Panel ID="pnlDetailWrapper" runat="server">
            <asp:HiddenField ID="hdnOperationType" runat="server" />
            <asp:HiddenField ID="hdnOperationSource" runat="server" />
            <asp:Panel ID="pnlDetail" runat="server">
            </asp:Panel>
        </asp:Panel>
    </telerik:RadPane>
</telerik:RadSplitter>

Any advice you can give would really be appreciated.

Thanks very much.

[Roger]

Should I pass the html containing the new page back to the javascript callback function, then load it into my detail panel in the javascript code? Basically, generate the html on the server, pass it back to javascript, have javascript find the detail pane control, clear it, and load the new html into it?

In my example code above, I am not doing anything to load the new html because I thought the RadAjaxManager would take care of that, since I have set the pnlDetailWrapper control to update itself when Ajax events happen but, maybe I am misunderstanding that functionality.

Thanks again for any help you can provide.

[Cori]

If you're using the RadAjaxManager's ajaxRequest method to update the page, then you should have an AjaxSetting with the RadAjaxManager as the control that initiates the request and in the UpdatedControls collection you should should the add the explorer and details controls.

Like so:

<telerik:AjaxSetting AjaxControlID="RadAjaxManager1">
            <UpdatedControls>
                <telerik:AjaxUpdatedControl ControlID="tvExplorer" />
                <telerik:AjaxUpdatedControl ControlID="pnlDetailWrapper" />
            </UpdatedControls>
        </telerik:AjaxSetting>

I hope that helps.

[Roger]

Yes that does help!

It works just as I had hoped.

Thanks very much.