RadTreeView failed to add nodes on client side after RadAjaxPanel Postback

3 posts, 0 answers
  1. Susanto
    Susanto avatar
    2 posts
    Member since:
    Jun 2009

    Posted 21 Jun 2009 Link to this post

    Hi,

    I have been trying to add nodes on the client side and its failed.
    The treeview is working fine without RadAjaxPanel postback.

    Following is my source code to add the nodes in TreeView on the client side.
    PS:
    - The following code is the sample page that I build to re-create the problem so you can copy and paste directly..
    - The TreeView is working fine when you comment out the following line in "SelectNextTab" function
    -----------------------
    $find('<%= rapMultiPage.ClientID %>').ajaxRequest();  
    ----------------------

    Any sample work around will be best.
    PS: I need the RadAjaxPanel to refresh the TreeView data when the user click "Next" button.

    Thanks.
    --------------------------
    <%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Default.aspx.cs" Inherits="TelerikTest._Default" %>
    <%@ Register Assembly="Telerik.Web.UI" Namespace="Telerik.Web.UI" TagPrefix="telerik" %>
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml" >
    <head runat="server">
        <title></title>
    </head>
    <body>
        <telerik:RadCodeBlock ID="rcbReport" runat="server">
            <script type="text/javascript">
                function SelectNextTab(TabIndex, direction) {
                    var multiPage = $find('<%=rmpCustomReport.ClientID %>');
                    if (multiPage) {
                        multiPage.set_selectedIndex(TabIndex);
                        if (direction == 'Next') {
                                //   Need to refresh the data based on the user's table selection
                                $find('<%= rapMultiPage.ClientID %>').ajaxRequest();
                                return false;
                        }

                    }
                    return false;
                }
                function MoveTo() {
                    var treeViewSource = $find("<%= rtvFields.ClientID %>");
                    if (treeViewSource) {
                            treeViewSource.trackChanges();
                            var node = new Telerik.Web.UI.RadTreeNode();
                            node.set_text("New Node");

                            treeViewSource.get_nodes().add(node);
                            treeViewSource.commitChanges();
                    }
                    return false;
                }
            </script>
        </telerik:RadCodeBlock>
        <form id="form1" runat="server">
        <div>
            <telerik:RadScriptManager ID="RadScriptManager1" runat="server">
            </telerik:RadScriptManager>
                        <telerik:RadAjaxPanel ID="rapMultiPage" runat="server" Width="99%">
                                <asp:Label ID="lblMessage" runat="server" Font-Bold="True" ForeColor="Red"></asp:Label><br />
                    <telerik:RadMultiPage id="rmpCustomReport" Runat="server" SelectedIndex="0">
                        <telerik:RadPageView id="Step1" runat="server">
                                        <table border="0" style="width: 98%">
                            <tr>
                                <td>
                                    Step 1 - Select the module to report on</td>
                            </tr>
                        </table>
                            <br />
                            <table border="0" style="width: 95%">
                                <tr>
                                    <td style="width: 700px; height: 450px" valign="top">
                                            <asp:CheckBoxList ID="cblModule" runat="server">
                                            </asp:CheckBoxList></td>
                                </tr>
                            </table>
                                        <br />
                            <table style="width: 700px">
                                <tr>
                                    <td>
                                    </td>
                                    <td align="right">
                                        <asp:Button ID="btnNext1" runat="server" CausesValidation="False" OnClientClick="SelectNextTab(1, 'Next'); return false;"
                                                Text="Next" /></td>
                                </tr>
                            </table>
                        </telerik:RadPageView>
                        <telerik:RadPageView id="Step3" Runat="server" Width="100%">
                            <br />
                                <table style="width: 700px">
                                    <tr>
                                        <td style="width: 345px;" valign="middle">
                                           
                                        </td>
                                        <td style="width: 345px" valign="top" >
                                            <asp:Panel ID="pDestinationBasic" runat="server" Height="420px" ScrollBars="Auto" Width="340px" BorderColor="Khaki" BorderStyle="Dotted">
                                            <asp:Button  ID="btnAddNode" runat="server" OnClientClick="MoveTo(); return false;"
                                                Text="Add Node" />
                                                <telerik:RadTreeView ID="rtvFields" runat="server" EnableDragAndDrop="True" EnableDragAndDropBetweenNodes="True" Skin="Web20" CausesValidation="False">
                                                    <CollapseAnimation Duration="100" Type="OutQuint" />
                                                    <ExpandAnimation Duration="100" />
                                                </telerik:RadTreeView>
                                            </asp:Panel>
                                        </td>
                                    </tr>
                                </table>
                            <br />
                            &nbsp;
                            <br />
                        </telerik:RadPageView>
                    </telerik:RadMultiPage>
                            </telerik:RadAjaxPanel>
        </div>
        </form>
    </body>
    </html>
    ------------------------------

  2. Susanto
    Susanto avatar
    2 posts
    Member since:
    Jun 2009

    Posted 24 Jun 2009 Link to this post

    No one can solve this ?

    Telerik Support are in heaven ?
  3. Veselin Vasilev
    Admin
    Veselin Vasilev avatar
    2992 posts

    Posted 25 Jun 2009 Link to this post

    Hello Susanto,

    We tested the scenario and confirm this is a bug. We will fix it for the official Q2 release scheduled for the end of the next week. In the meantime you can use the following workaround - add the highlighted line in your javascript code:

    function MoveTo() { 
      var treeViewSource = $find("<%= rtvFields.ClientID %>"); 
      if (treeViewSource) { 
        treeViewSource.trackChanges(); 
        var node = new Telerik.Web.UI.RadTreeNode(); 
        node.set_text("New Node"); 
     treeViewSource._childListElementCssClass = "rtUL rtLines";  
        treeViewSource.get_nodes().add(node); 
        treeViewSource.commitChanges(); 
      }
       return false

    We updated your Telerik Points for finding this problem.

    Greetings,
    Veselin Vasilev
    the Telerik team

    Instantly find answers to your questions on the new Telerik Support Portal.
    Check out the tips for optimizing your support resource searches.
Back to Top