treeview expand depth 2 collapse to depth level 0.

I have treeview on update panel and loading folders based on user interaction. It works for depth level 2 but at this point clicking the node shows depth level 0 results. is there something I am missing?

here are few lines of crap...

Thanks for you help.

<asp:TreeViewid="SourceTreeView"runat="server"Width="100%"OnSelectedNodeChanged="SourceTreeView_SelectedNodeChanged"OnTreeNodeExpanded="SourceTreeView_TreeNodeExpanded"ShowCheckBoxes="Leaf"ImageSet="Simple"Height="100%"ExpandDepth="1"MaxDataBindDepth="10"NodeIndent="15">

<ParentNodeStyleFont-Bold="False"></ParentNodeStyle>

<HoverNodeStyleForeColor="#5555DD"Font-Underline="True"></HoverNodeStyle>

<SelectedNodeStyleHorizontalPadding="0px"ForeColor="#5555DD"VerticalPadding="0px"Font-Underline="True"></SelectedNodeStyle>

<NodeStyleNodeSpacing="0px"HorizontalPadding="0px"ForeColor="Black"VerticalPadding="0px"Font-Size="10pt"Font-Names="Tahoma"></NodeStyle>

</asp:TreeView>

I am adding nodes per users request using following code, which is same for depth 0,1 and 2.

newNode.Expanded =false;

newNode.ShowCheckBox =false;

newNode.PopulateOnDemand =true;newNode.SelectAction =TreeNodeSelectAction.Select;

treeNode.ChildNodes.Add(newNode);

sg20000:

is there something I am missing

You are missing, that the treeview is not supported in the updatepanel

Check here:

UpdatePanel Control Overview

Maybe you are right and thanks for your help.

I found at some places forward slash was being used, i fixed that and while trying to make it work, made some other changes to node before adding to tree and seems like it is working. I think some nodes had / (creating some escape sequences) or something else to trigger wrapping of tree.

is that treeview on update panel will behave unpredictablly or there are some other issues?

sg20000:

is that treeview on update panel will behave unpredictablly or there are some other issues?

I'm also using treeview with updatepanel, regardless is it not supported.

Main issue which I found that the tree state (selected node, expanded/collapsed nodes state etc.) stays out sync when a postback occurs. Especially when you use any client side capability (populate on demand, enableclientscript=true).

For example:

- Treeview in up

- User coll/exp nodes (no postback yet)

- User select a node, partial postback, selectednodechanged handled for example.

- User select a different node, same as before, but coll/exp state messed up.

- etc.

Without client script features it's ok in up, but slow (big complicated markup, big viewstate etc.)

Treeview inside an Accordion control issue

Hello all

I am having a problem with dynamically loading treenodes with treeview control inside an accordion control. I am gettting "object Reference not set" when adding a treenode to the treeview using the following code:

treeview.Nodes.Add(treenode)

If I pull the treeview out of the accordion control the same code works as expected.

Here is the code inside aspx:

<AjaxControlToolkit:Accordion

ID="accNavigation"

runat="server"

Width="250px"

FramesPerSecond="40"

TransitionDuration="250"

AutoSize="Fill"

SelectedIndex="0"

CssClass=""

HeaderCssClass="accordionHeader"

HeaderSelectedCssClass="accordionHeaderSelected"

ContentCssClass="accordionContent">

<Panes>

<AjaxControlToolkit:AccordionPane

ID="apMyEvaluations"

runat="server">

<Header>

<ahref=""onclick="return false;">My Evaluations</a>

</Header>

<Content>

<asp:TreeView

ID="tvMyEvaluations"

runat="server"

NodeIndent="18"

NodeStyle-HorizontalPadding="5"

SelectedNodeStyle-BackColor="navy"

SelectedNodeStyle-ForeColor="white"

ShowLines="true">

</asp:TreeView>

</Content>

</AjaxControlToolkit:AccordionPane>

<AjaxControlToolkit:AccordionPane

ID="AccordionPane2"

runat="server">

<Header>

<ahref=""onclick="return false;">Manager Listing</a>

</Header>

<Content>

<asp:TreeView

ID="tvManagerListing"

runat="server"

NodeIndent="0"

NodeStyle-HorizontalPadding="5"

SelectedNodeStyle-BackColor="navy"

SelectedNodeStyle-ForeColor="white"

ShowLines="true">

<Nodes>

<asp:TreeNodeText="Manager Listing"Value="L">

<asp:TreeNodeText="ASP .Net"Value="ASP"ImageUrl="Images/24_Manager.ico"></asp:TreeNode>

<asp:TreeNodeText="Visual Basic"Value="VB"ImageUrl="Images/24_Manager.ico"></asp:TreeNode>

</asp:TreeNode>

</Nodes>

</asp:TreeView>

</Content>

</AjaxControlToolkit:AccordionPane>

</Panes>

</AjaxControlToolkit:Accordion>

Below is the code used to build the tree nodes:

'TreeNode Declarations

Dim tnMyEvaluationsRootAs TreeNode

Dim tnPrimaryAs TreeNode

Dim tnSecondaryAs TreeNode

'Using the tree view for My Evaluations, populate tree nodes

WithMe.tvMyEvaluations

'Instaniate a new parent node

tnPrimary =New TreeNode("Primary","PRIMARY","~/Images/16_Copy.ico")

'Add primary evaluation

tnPrimary.ChildNodes.Add(New TreeNode("Employee, Some 1","1","~/Images/16_User.ico"))

tnPrimary.ChildNodes.Add(New TreeNode("Employee, Some 2","2","~/Images/16_User.ico"))

tnPrimary.ChildNodes.Add(New TreeNode("Employee, Some 3","3","~/Images/16_User.ico"))

tnPrimary.ChildNodes.Add(New TreeNode("Employee, Some 4","4","~/Images/16_User.ico"))

tnPrimary.ChildNodes.Add(New TreeNode("Employee, Some 5","5","~/Images/16_User.ico"))

tnPrimary.ChildNodes.Add(New TreeNode("Employee, Some 6","6","~/Images/16_User.ico"))

tnPrimary.ChildNodes.Add(New TreeNode("Employee, Some 7","7","~/Images/16_User.ico"))

tnPrimary.ChildNodes.Add(New TreeNode("Employee, Some 8","8","~/Images/16_User.ico"))

tnPrimary.ChildNodes.Add(New TreeNode("Employee, Some 9","9","~/Images/16_User.ico"))

tnPrimary.ChildNodes.Add(New TreeNode("Employee, Some 10","10","~/Images/16_User.ico"))

tnPrimary.ChildNodes.Add(New TreeNode("Employee, Some 11","11","~/Images/16_User.ico"))

'Instaniate a new parent node

tnMyEvaluationsRoot =New TreeNode("My Evaluations","MY_ROOT","~/Images/16_Copy.ico")

'Add primary evaluations to root node

tnMyEvaluationsRoot.ChildNodes.Add(tnPrimary)

'Add node to My Evaluations tree view

.Nodes.Add(tnMyEvaluationsRoot)

EndWith

Any help would be greatly appreciated.

Tom

Hi Tom,

I can't find the line "treeview.Nodes.Add(treenode)" in your code snippet.

According to your description, it seems treeview object is null. And such problem is usually caused by use FindControl to get reference to treeview object, you get null reference when the method fails. Please make sure the method is invoked on the right parent control.

If this doesn't help, please post relevant code.

Also, the treeview doesn't work well with most ajax things, including updatepanel (which could also be the source of your problem)..

A nice workaround is to use the treeview inside an iframe (just hide the frameborder and remove margins of the frame and noone will never know.. ;o) ).

Treeview programatically populated with webservice

I'm trying to display a loading animation and background color while a treeview is populated by a webservice. I'm implementing the ajax incremental display pattern by just loading a div for a menu and the Loading animation in it's own div at the start. The java script calls a ajax web service to programmatically populate a treeview which I want to display in the menu div. The only thing I don't know how to do is get the populated Treeview control from the webservice to the actual website.

Here is my javascript located in the head of the menu.aspx page:

<script type="text/javascript" language="JavaScript">
<!--
 function pageLoad() {
 MenuService.LoadMenu(OnComplete,OnTimeOut,OnError);
 }
 function OnComplete(result){
 document.getElementById("menuLoad").style.display="none";//erases loading Message
 }
 function OnTimeOut(result){
 alert("Timeout")
 }
 function OnError(result){
 alert("Error")
 }
 // --></script>

 <form id="form1" runat="server">
 <asp:ScriptManager ID="ScriptManager1" runat="server">
 <Services>
 <asp:ServiceReference Path="MenuService.asmx" />
 </Services>
 </asp:ScriptManager>
 <div id="menuLoad"><IMG src="Resources/Images/ajax-loader-Menu.gif" /> Loading Menu...</div>
 <div id="menu">
 </div>
 </form>

Can anyone help with my problem? I doubt it is too complex, I'm just very new at using Ajax and web services. Should me web service return the treeview? or what? Is there a better way to do what I'm intending?

Thanks for the help in advance class='cmt'>//erases loading Message } function OnTimeOut(result){ alert("Timeout") } function OnError(result){ alert("Error") }// -->

I found any easier way to do this which out having to use a webservice, It initially loads a Page that Contains the Loading message and graphic and then using javascript to load the actual menu which is a completely different aspx page. The new page just loads the nodes of the treeview in the code behind.

MenuLoading.aspx:

<head runat="server"> <title>Menu</title> <link href="Resources/Css/Site.css" rel="stylesheet" type="text/css" /> <script type="text/javascript" language="JavaScript"><!-- function pageLoad() { document.location.href="Menu.aspx" } // --></script></head><body onload="pageLoad()"> <form id="form1" runat="server"> <div id="menuLoad"><IMG src="Resources/Images/ajax-loader-Menu.gif" /> Loading Menu...</div> </form></body>

menu.aspx:

 
<head runat="server"> <title>Menu</title> <link href="Resources/Css/Site.css" rel="stylesheet" type="text/css" /></head><body> <form id="form1" runat="server"> <div id="menu"> <asp:TreeView ID="TreeView1" runat="server" ExpandDepth="1" ImageSet="XPFileExplorer" ShowLines="True" NodeIndent="5" OnSelectedNodeChanged="TreeView1_SelectedNodeChanged"> <HoverNodeStyle ForeColor="White" BackColor="#47678E" /> <LeafNodeStyle ImageUrl="Resources/Images/Grid.bmp" HorizontalPadding="2px" /> <NodeStyle Font-Names="Tahoma" Font-Size="8pt" ForeColor="Black"/> </asp:TreeView> </div> </form></body>
 Hopefully I clearly explained my solution.