[CLOSED] Javascript tree error

  1. #1

    [CLOSED] Javascript tree error

    I am loading a treepanel using javascript but I am getting the following error when I want to expand.

    JavaScript runtime error: Unable to get property 'style' of undefined or null reference

    Here is the html part

    <%@ Page Language="vb" AutoEventWireup="false" CodeFile="TreeView.aspx.vb" Inherits="TreeView" %>
    
    <!DOCTYPE html>
    
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head runat="server">
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
        <title></title>
        <script type="text/javascript">
    
            function nodeLoadSt(parent) {
        
                var more = false;
                if (parent.firstChild != null) {
                    return;
                }
                var found = false;
                for (var i = 0, len = App.stMenu.data.length; i < len; i++) {
                    if (parent.lastOptions.id == App.stMenu.data.items[i].data.IDParent) {
                        found = true;
                        for (var k = 0, leng = App.stMenu.data.length; k < leng; k++) {
                            if (App.stMenu.data.items[i].data.IDClient == App.stMenu.data.items[k].IDParent) {
                                more = true;
                            };
                        };
                        if (more == true) {
                            more = false;
    
                            var store = App.treeSt.getStore(), node = store.getNodeById(parent.lastOptions.id);
    
                            node.appendChild({
                                text: App.stMenu.data.items[i].data.Client,
                                id: App.stMenu.data.items[i].data.IDClient,
                                expandable: true
                            })
    
    
                        }
                        else {
    
    
                            var store = App.treeSt.getStore(), node = store.getNodeById(parent.lastOptions.id);
    
                            node.appendChild({
                                text: App.stMenu.data.items[i].data.Client,
                                id: App.stMenu.data.items[i].data.IDClient,
                                expandable: false,
                                leaf: true
                            })
    
                           
    
    
                        };
                      
                    }
    
                }
    
                if (found == true) {
                    node.expand()
                };
    
            }
        </script>
    </head>
        
    <body>
        <form id="form1" runat="server">
        <div>
         <ext:ResourceManager ID="ScriptManager1"  Theme="Gray"  Locale="en-GB" runat="server">
       
        </ext:ResourceManager>
            <ext:Store ID="stMenu" runat="server" Data="<%# TestData %>" AutoDataBind="true">
                <Model>
                    <ext:Model ID="Model1" runat="server">
                        <Fields>
                            <ext:ModelField Name="IDParent" />
                            <ext:ModelField Name="IDClient" />
                            <ext:ModelField Name="Client" />
                        </Fields>
                    </ext:Model>
                </Model>
    
                <Reader>
                    <ext:ArrayReader />
                </Reader>
            </ext:Store>
            <ext:TreePanel Border="false" StyleSpec="margin-top: 30px" ID="treeSt" runat="server"
                Width="270" AutoHeight="true" Animate="true" TitleCollapse="true" AutoScroll="true"
                Collapsible="true" Collapsed="false" CollapseFirst="true">
                <Root>
                    <ext:Node Expandable="True" NodeID="0" Text="Root">
                    </ext:Node>
                </Root>
                <Listeners>
                    <BeforeLoad Fn="nodeLoadSt" />
                </Listeners>
            </ext:TreePanel>
    
    
        </div>
        </form>
    </body>
    </html>
    Here is the vb code

    Public Class TreeView
        Inherits System.Web.UI.Page
    
     
        Public ReadOnly Property TestData() As Object
            Get
                Return New Object() {New Object() {"0", "1", "Main"}, New Object() {"1", "2", "Layer1_0"}, New Object() {"1", "3", "Layer1_1"}, New Object() {"1", "4", "Layer1_3"}, New Object() {"2", "5", "Layer2_0"}, New Object() {"2", "6", "Layer2_1"}}
            End Get
        End Property
    End Class
    Can someone see what I am doing wrong. It assistance would be appreciated.
    Last edited by Daniil; Mar 26, 2015 at 1:11 PM. Reason: [CLOSED]
  2. #2
    Hi @Richardt,

    You should add return false; at the end of the nodeLoadSt function to prevent the default load operation.

    There is a similar example, but with a DirectMethod.
    https://examples3.ext.net/#/TreePane.../Direct_Method
  3. #3
    Hi Daniil

    Thanks a lot. I've been pulling my hair out for the last 2 days trying to figure this one out. Yet it was so simple.

Similar Threads

  1. Add tree node via javascript from child window
    By cicaglisa in forum 1.x Help
    Replies: 25
    Last Post: Apr 26, 2013, 3:33 PM
  2. Refresh static Tree error
    By Chris in forum 1.x Help
    Replies: 5
    Last Post: Oct 12, 2011, 8:04 AM
  3. [CLOSED] Problem when adding a Tree Node from Javascript
    By speedstepmem3 in forum 1.x Legacy Premium Help
    Replies: 3
    Last Post: Dec 15, 2010, 9:45 AM
  4. Replies: 2
    Last Post: Oct 29, 2010, 10:04 AM
  5. [CLOSED] Error when deleting a tree leaf
    By Sharon in forum 1.x Legacy Premium Help
    Replies: 2
    Last Post: Jan 21, 2009, 11:12 AM

Posting Permissions