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

TreeView .get_allNodes() Javascript

2 Answers 233 Views
TreeView
This is a migrated thread and some comments may be shown as answers.
Craig
Top achievements
Rank 1
Craig asked on 25 Jul 2012, 04:00 PM
Having some problems with the javascript to get all nodes using the sample code provided here:

http://www.telerik.com/help/aspnet-ajax/treeview-client-objects-radtreenode.html

Am getting the error

Error: TypeError: tree is null
Source File: http://localhost/Edit/CategorySelection.aspx
Line: 48

I thought jQuery might be causing some problems, it is in no conflict mode. have tried changing
var tree = $find("<%= RadTreeView1.ClientID %>");
to
var tree = jQuery("<%= RadTreeView1.ClientID %>");
but i get the error

Error: TypeError: tree.get_nodes is not a function
Source File: http://localhost/Edit/CategorySelection.aspx
Line: 48

Any idea whats causing this error? (code below, js to get nodes contained in nodetest and loaded on document load

Master Page:

<%@ Master Language="C#" AutoEventWireup="true" CodeFile="Main1.master.cs" Inherits="Main1" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<head runat="server">
    <title></title>
    <link rel="stylesheet" href="~/css/style.css" />
    <script type="text/javascript" src="/js/jquery-1.7.2.min.js"></script>
    <script type="text/javascript">jQuery.noConflict();</script>
    <asp:ContentPlaceHolder id="ContentHead" runat="server">
    </asp:ContentPlaceHolder>
</head>
<body>
    <div id="wrapper">
        <form id="form1" runat="server">
            <asp:Literal ID="test1" runat="server"></asp:Literal>
            <telerik:RadScriptManager ID="RadScriptManager1" runat="server" />
            <div class="headercon">
                <asp:Panel id="header" CssClass="header" runat="server">
                    <asp:HyperLink ID="HyperLink1" NavigateUrl="~/?reset=global" runat="server">
                        <div class="logo">                       
                        </div>
                    </asp:HyperLink>
                    <div class="fascia"></div>
                    <div class="topmenu">
                        <ul>
                            <li class="on"><asp:HyperLink ID="HyperLink2" NavigateUrl="~/" runat="server">Dashboard</asp:HyperLink></li>
 
                            <li class="list">
                                <asp:Label ID="LabelFascia" runat="server" AssociatedControlID="FasciaDropDown" Text="Fascia" />
                                <telerik:RadComboBox ID="FasciaDropDown" runat="server" Width="140px" AutoPostBack="True" OnSelectedIndexChanged="Fascia_SelectedIndexChanged" />
                            </li>
 
                            <li><asp:HyperLink ID="HyperLink3" NavigateUrl="~/Edit/Default.aspx" runat="server">Style</asp:HyperLink></li>
                            <li><asp:HyperLink ID="HyperLink4" NavigateUrl="~/Reports/Default.aspx" runat="server">Reports</asp:HyperLink></li>
                            <li><asp:HyperLink ID="HyperLink5" NavigateUrl="~/Admin/Default.aspx" runat="server">Admin</asp:HyperLink></li>
                        </ul>
                    </div>
                </asp:Panel>
            </div>
            <div class="content">
                <asp:Panel id="breadcrumbs" runat="server"></asp:Panel>
                <asp:ContentPlaceHolder id="ContentMain" runat="server">
                </asp:ContentPlaceHolder>
            </div>
            <div class="footer">
            </div>
        </form>
    </div>
</body>
</html>

Page

<%@ Page Title="" Language="C#" MasterPageFile="~/Main1.master" AutoEventWireup="true" CodeFile="CategorySelection.aspx.cs" Inherits="CategoryEditor" %>
<asp:Content ID="Content1" ContentPlaceHolderID="ContentHead" Runat="Server">
    <script type="text/javascript">
        //<!--
        function nodeDropping(sender, args) {
            // set target to the element on which the node is dropped
            var target = args.get_htmlElement();
            // check whether target is in the panel or tree view
            // by working up the parent chain to a known element
            try {
                while (target) {
 
                    var targetID = target.id;
                    var className = target.className;
                    // we reached the tree view -- this is a good target                 
                    if (targetID == "<%# RadTreeView1.ClientID %>")
                        return;
                    // the "between nodes" lines are not actually in the tree view,
                    // but they have class names that begin "rtDrop"
                    else if (className.startsWith("rtDrop"))
                        return;
                    // we are inside the panel -- this is a good target
                    else if (targetID == "<%# Panel1.ClientID %>") {
                        args.set_htmlElement(target);
                        return;
                    }
                    target = target.parentNode;
                }
            } catch (e) { }
            // we were not in a good target, cancel the drop
            args.set_cancel(true);
        }
 
        function nodeCheck(sender, args) {
            var target = args.get_selectedNodes();
 
        }
 
        function nodetest() {
            var tree = $find("<%= RadTreeView1.ClientID %>");
            var allNodes = tree.get_nodes().getNode(0).get_allNodes();
            for (var i = 0; i < allNodes.length; i++) {
                var node = allNodes[i];
                alert(node.get_text());
            }
 
        }
 
        jQuery(document).ready(function () {
            nodetest();
        });
 
        //-->
    </script>
</asp:Content>
<asp:Content ID="Content2" ContentPlaceHolderID="ContentMain" Runat="Server">
    <h1>Category Editor</h1>
    <telerik:RadAjaxLoadingPanel ID="RadAjaxLoadingPanel1" runat="server" />
    <asp:Label ID="treeSearchLabel" runat="server">Refine</asp:Label>
    <asp:TextBox ID="treeSearch" runat="server"></asp:TextBox>
    <telerik:RadAjaxPanel ID="RadAjaxPanel1" runat="server" LoadingPanelID="RadAjaxLoadingPanel1">
        <telerik:RadTreeView ID="RadTreeView1" runat="server"
            EnableDragAndDrop="true"
            OnNodeDrop="TreeView_NodeDrop"
            OnClientNodeDropping="nodeDropping"
 
            TriStateCheckBoxes="true"
            CheckBoxes="true"
            CheckChildNodes="false"
            >
            <Nodes>
            </Nodes>
        </telerik:RadTreeView>
    </telerik:RadAjaxPanel>
 
    <asp:Panel ID="Panel1" runat="server" ForeColor="#7799FF" BorderColor="#7799FF"
        BorderStyle="Double" BorderWidth="4px" GroupingText="Details" >
        <asp:Label ID="Label1" runat="server" ></asp:Label>
        <asp:Label ID="WhatsChecked" runat="server" ></asp:Label>
    </asp:Panel>
    <telerik:RadAjaxManager ID="RadAjaxManager1" runat="server">
        <AjaxSettings>
            <telerik:AjaxSetting AjaxControlID="RadTreeView1">
                <UpdatedControls>
                    <telerik:AjaxUpdatedControl ControlID="RadTreeView1" />
                    <telerik:AjaxUpdatedControl ControlID="Panel1" />
                </UpdatedControls>
            </telerik:AjaxSetting>
        </AjaxSettings>
    </telerik:RadAjaxManager>
</asp:Content>

2 Answers, 1 is accepted

Sort by
0
Accepted
Princy
Top achievements
Rank 2
answered on 26 Jul 2012, 11:14 AM
Hi Craig,

One suggestion is you can bind your script in OnClientLoad event of Radtreeview and access it as follows.

Javascript:
function nodetest(sender, args)
{    
 var allNodes = sender.get_nodes().getNode(0).get_allNodes();
 for (var i = 0; i < allNodes.length; i++)
 {
  var node = allNodes[i];
  alert(node.get_text());
 }
}

ASPX:
<telerik:RadTreeView ID="RadTreeView1" OnClientLoad="nodetest" runat="server"
  EnableDragAndDrop="true"
  OnNodeDrop="TreeView_NodeDrop"
  OnClientNodeDropping="nodeDropping"
  TriStateCheckBoxes="true"
  CheckBoxes="true"
  CheckChildNodes="false" >
  <Nodes>
  </Nodes>
</telerik:RadTreeView>

Thanks,
Princy.
0
Craig
Top achievements
Rank 1
answered on 30 Jul 2012, 08:30 AM
Hi Princy,

Thanks for your reply thats sorted my problem,

many thanks
Craig
Tags
TreeView
Asked by
Craig
Top achievements
Rank 1
Answers by
Princy
Top achievements
Rank 2
Craig
Top achievements
Rank 1
Share this question
or