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

ajaxRequest event is fired but, panel is not updated

3 Answers 98 Views
Ajax
This is a migrated thread and some comments may be shown as answers.
Roger
Top achievements
Rank 1
Roger asked on 26 Jul 2010, 09:44 PM
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.

3 Answers, 1 is accepted

Sort by
0
Roger
Top achievements
Rank 1
answered on 26 Jul 2010, 10:06 PM
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.
0
Accepted
Cori
Top achievements
Rank 2
answered on 27 Jul 2010, 02:20 PM
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.
0
Roger
Top achievements
Rank 1
answered on 27 Jul 2010, 02:29 PM
Yes that does help!

It works just as I had hoped.

Thanks very much.
Tags
Ajax
Asked by
Roger
Top achievements
Rank 1
Answers by
Roger
Top achievements
Rank 1
Cori
Top achievements
Rank 2
Share this question
or