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

RadGrid RadTreeView LoadOnDemand and NodeTemplate

5 Answers 218 Views

TreeView

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

Kevin asked on 07 Aug 2012, 09:54 PM

I had written a page that employed a RadGrid with an EditTemplate that contained a RadTreeView that itself contained a NodeTemplate. It all worked fine until my RadTreeView got too many nodes in it and just ran way too slow. I decided I need to move toward a Load on Demand solution for the RadTreeView. But the complexity of needing to generate a partial tree of templated nodes within an edited RadGrid has proven just more than I can figure out how to do.

So, I've boiled it down to a simple case that I think captures all the important parts of my implementation. There's a commented section in the code-behind that can be uncommented to enable Load on Demand. I didn't supply any of my futile implementations in TreeView_NodeExpand because none of them have worked. I'm asking for what might go in there to make this example work.

My aspx file is:

<%@ Page AutoEventWireup="true" CodeFile="DefaultCS.aspx.cs"

Inherits="Telerik.Web.Examples.Grid.Integration.GridWithTreeViewComboBoxEditors.DefaultCS"

Language="c#" %>

<%@ Register TagPrefix="telerik" Namespace="Telerik.Web.UI" Assembly="Telerik.Web.UI" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

<head runat="server"></head>

<body class="BODY">

<form runat="server" id="mainForm" method="post">

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

<asp:UpdatePanel RunAt="Server"> <ContentTemplate>

<telerik:RadGrid ID="FooGrid" OnNeedDataSource="FooGrid_NeedDataSource"

OnItemDataBound="FooGrid_ItemDataBound"

AutoGenerateEditColumn="true" runat="server" >

<MasterTableView>

<EditFormSettings EditFormType="Template">

<FormTemplate>

<telerik:RadTreeView ID="TreeView" DataTextField="Text" DataFieldID="Key"

DataFieldParentID="Parent" DataValueField="Key"

OnNodeExpand="TreeView_NodeExpand" RunAt="Server" >

<NodeTemplate>

<telerik:RadButton

ButtonType="ToggleButton" ToggleType="CheckBox" AutoPostBack="false"

Checked='<%# Bind("CanView") %>' Text="View" ID="CanViewButton"

RunAt="Server" />

<telerik:RadButton

ButtonType="ToggleButton" ToggleType="CheckBox" AutoPostBack="false"

Text="Alter" RunAt="Server" />

- <%# DataBinder.Eval(Container, "Text") %>

</NodeTemplate>

</telerik:RadTreeView>

<telerik:RadButton

Text='<%# (Container is GridEditFormInsertItem) ?

"Insert" : "Update" %>'

CommandName='<%# (Container is GridEditFormInsertItem) ?

"PerformInsert" : "Update" %>' RunAt="Server" />

<telerik:RadButton Text="Cancel" CommandName="Cancel" RunAt="Server" />

</FormTemplate>

</EditFormSettings>

</MasterTableView>

</telerik:RadGrid>

</ContentTemplate> </asp:UpdatePanel>

</form>

</body>

</html>

And my code-behind is:

using System.Configuration;

using System.Data;

using System.Data.SqlClient;

using System.Web.UI;

using Telerik.Web.UI;

using System;

using System.Collections.Generic;

namespace Telerik.Web.Examples.Grid.Integration.GridWithTreeViewComboBoxEditors {

public partial class DefaultCS : Page {

public void FooGrid_NeedDataSource(Object sender, GridNeedDataSourceEventArgs e) {

FooGrid.DataSource=new GreekGods();

}

public void FooGrid_ItemDataBound(Object sender, GridItemEventArgs e) {

GridEditFormItem item=e.Item as GridEditFormItem;

if (item != null && item.IsInEditMode) {

RadTreeView treeView=item.FindControl("TreeView") as RadTreeView;

if (treeView != null) {

treeView.DataSource=new TreeDataList();

treeView.DataBind();

// To enable Load on Demand, uncomment these lines

// foreach (RadTreeNode pNode in treeView.Nodes) {

// pNode.ExpandMode=TreeNodeExpandMode.ServerSideCallBack;

// pNode.Nodes.Clear();

// }

}

public void TreeView_NodeExpand(Object sender, RadTreeNodeEventArgs e) {

// What can go in here that will allow me to create nodes according to

// the NodeTemplate in the aspx file.

}

//////////// From here down is just canned data

public class GreekGod {

private string name;

public string Name { get { return name; } set { name = value; } }

private string description;

public string Description { get { return description; } set { description = value; } }

private string romanName;

public string RomanName { get { return romanName; } set { romanName = value; } }

public GreekGod(string name, string description, string romanName) {

this.name = name;

this.description = description;

this.romanName = romanName;

}

public class GreekGods : List<GreekGod> {

public GreekGods() {

this.Add(new GreekGod("Aphrodite", "Goddess of love, beauty and fertility", "Venus"));

this.Add(new GreekGod("Apollo", "God of prophesy, music and healing", "Apollo"));

this.Add(new GreekGod("Ares", "God of war", "Mars"));

}

public class TreeData {

private string key;

public string Key { get { return key; } set { key=value; } }

private string text;

public string Text { get { return text; } set { text=value; } }

private string parent;

public string Parent { get { return parent; } set { parent=value; } }

private bool canView;

public bool CanView { get { return canView; } set { canView=value; } }

public TreeData(string key, string text, string parent)

{ Key=key; Text=text; Parent=parent; }

}

public class TreeDataList: List<TreeData> {

public TreeDataList() {

Add(new TreeData("0", "P1", null)); this[0].CanView=true;

Add(new TreeData("1", "P1C1", "0"));

Add(new TreeData("2", "P2", null));

Add(new TreeData("3", "P2C1", "2"));

Add(new TreeData("4", "P2C2", "2"));

Add(new TreeData("5", "P3", null));

Add(new TreeData("6", "P3C1", "5"));

}

Thanks.

5 Answers, 1 is accepted

answered on 10 Aug 2012, 11:02 AM

LoadOnDemandRadTreeView-inside-RadGrid.zip

Hello Kevin,

I have made a little modifications to your code so the requested scenario could be achieved. Take a look at it and test it locally to see whether it will fit your scenario.

Please note that in order to receive a quick response to your questions you need to open a support ticket where you will get the answers to your queries in the timespan determined by your telerik subscription.

Regards,
Ivana
the Telerik team

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.

Accepted

answered on 15 Aug 2012, 11:07 AM

Hi Kevin,

I am not sure I understand your last query very well, but if you need to apply the CanView option to the RadButton representing this bit of information you could do the following in the ItemDataBound event of the RadGrid :

public void FooGrid_ItemDataBound(Object sender, GridItemEventArgs e)

{

GridEditFormItem item = e.Item as GridEditFormItem;

if (item != null && item.IsInEditMode)

{

RadTreeView treeView = item.FindControl("TreeView") as RadTreeView;

if (treeView != null)

{

TreeDataList td = new TreeDataList();

TreeDataList parents = td.GetParents();

foreach (TreeData tdata in parents)

{

RadTreeNode node = new RadTreeNode();

node.Text = tdata.Text;

node.Value = tdata.Key;

node.ExpandMode = TreeNodeExpandMode.ServerSide;

treeView.Nodes.Add(node);

if (tdata.CanView)

{

(node.FindControl("CanViewButton") as RadButton).Checked = true;

}

treeView.DataBind();

}

as well as in the PopulateChindNodes method:

private void PopulateChildNodes(RadTreeNodeEventArgs e, TreeNodeExpandMode treeNodeExpandMode)

{

TreeDataList tdlist = new TreeDataList();

TreeDataList data = tdlist.GetChildren(e.Node.Value);

foreach (TreeData item in data)

{

RadTreeNode node = new RadTreeNode();

node.Text = item.Text;

node.Value = item.Key;

node.ExpandMode = TreeNodeExpandMode.ServerSide;

e.Node.Nodes.Add(node);

if (item.CanView)

{

(node.FindControl("CanViewButton") as RadButton).Checked = true;

}

e.Node.Expanded = true;

}

Regards,
Ivana
the Telerik team