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

Dynamic treeview and Load on Demand issue

2 Answers 125 Views

TreeView

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

wg asked on 02 Jun 2013, 01:22 PM

20130602211906treeview.jpg

Hi,

I have a dynamic treeview which is created in page_load. and I want to make it load on demand. here is my code.

using System;

using System.Collections.Generic;

using System.Web;

using System.Web.UI;

using System.Web.UI.WebControls;

using Telerik.Web.UI;

using System.Linq;

namespace TreeViewTest

{

public partial class _Default : System.Web.UI.Page

{

protected void Page_Load(object sender, EventArgs e)

{

RadTreeView treeView = new RadTreeView();

if (!IsPostBack)

{

var treeViewDataList = GetDB().Where(c => c.ParentId == null);

foreach (var treeviewItem in treeViewDataList)

{

RadTreeNode node = new RadTreeNode();

node.Text = treeviewItem.Name;

node.Value = treeviewItem.Id.ToString();

node.ExpandMode = TreeNodeExpandMode.ServerSide;

treeView.Nodes.Add(node);

}

treeView.NodeExpand += (s, arg) =>

{

if (arg.Node.Nodes.Count == 0)

{

//string pId = "-1";

var treeViewDataList = GetDB().Where(c => c.ParentId.ToString() == arg.Node.Value);

foreach (var treeviewItem in treeViewDataList)

{

RadTreeNode node = new RadTreeNode();

node.Text = treeviewItem.Name;

node.Value = treeviewItem.Id.ToString();

node.ExpandMode = TreeNodeExpandMode.ServerSide;

arg.Node.Nodes.Add(node);

}

arg.Node.Expanded = true;

}

};

this.form1.Controls.Add(treeView);

}

public List<TreeViewItem> GetDB()

{

List<TreeViewItem> list = new List<TreeViewItem>();

list.Add(new TreeViewItem { Id=1, Name="A", ParentId=null });

list.Add(new TreeViewItem { Id = 2, Name = "B", ParentId = null });

list.Add(new TreeViewItem { Id = 3, Name = "C", ParentId = null });

list.Add(new TreeViewItem { Id = 4, Name = "A-01", ParentId = 1 });

list.Add(new TreeViewItem { Id = 5, Name = "A-02", ParentId = 1 });

list.Add(new TreeViewItem { Id = 6, Name = "B-01", ParentId = 2 });

return list;

}

public class TreeViewItem

{

public int Id { get; set; }

public string Name { get; set; }

public int? ParentId { get; set; }

}

And here is aspx code

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Default.aspx.cs" Inherits="TreeViewTest._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>

<form id="form1" runat="server">

<telerik:RadScriptManager ID="RadScriptManager1" runat="server"></telerik:RadScriptManager>

<div>

</div>

</form>

</body>

</html

but after click the node to expand it, it gives empty nodes like attached image.

Could you please take a look at it?

Thank you very much.

Bill

2 Answers, 1 is accepted

Accepted

answered on 05 Jun 2013, 02:02 PM

Hello,

Please try to load you RadTreeView on every page load instead of only the initial page load:
//code behind

protected void Page_Load(object sender, EventArgs e)

{

RadTreeView treeView = new RadTreeView();

var treeViewDataList = GetDB().Where(c => c.ParentId == null);

foreach (var treeviewItem in treeViewDataList)

{

RadTreeNode node = new RadTreeNode();

node.Text = treeviewItem.Name;

node.Value = treeviewItem.Id.ToString();

node.ExpandMode = TreeNodeExpandMode.ServerSide;

treeView.Nodes.Add(node);

}

treeView.NodeExpand += treeView_NodeExpand;

this.form1.Controls.Add(treeView);

}

Regards,
Boyan Dimitrov
Telerik

If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the RadControls for ASP.NET AJAX, subscribe to their blog feed now.