Hallo, I want to generate my treeview base on the data in my table, for example i have a table TreeStructure that contain
ID -> auto_inc
PARENT_ID -> int
NAME -> character
ID is the primary key, PARENT_ID contains ID of it's parent and NAME is the text I want to display
I want to know is there any way i can generate this data into structured treeview automatically? because before this I do it manually with recursive.
Data Sample ( ID / PARENT_ID / NAME )
1 / 0 / IT , 2 / 0 / SUPPORT , 3 / 0 / SALES
4 / 1 / DEVELOPER , 4 / 1 / NETWORK , 5 / 2 / EDP
tree result :
- IT
---- DEVELOPER
---- NETWORK
- SUPPORT
----EDP
- HRD
thx before :)
Hello,
There are various ways to proceed with binding from a single self-referencing table with ID -> ParentID relation. Recursion is one of them, but there are also easier ways to do it. For example, you can use the Levels collection of the tree to denote the relation - there is a great article describing just that here:
http://devcenter.infragistics.com/Support/KnowledgeBaseArticle.aspx?ArticleID=10087
Another great way to do that, is to use our new WebHierarchicalDataSource control, which lets you create hierarchical relation with a single self-referencing table. We have a nice example that shows that here:
http://samples.infragistics.com/2008.2/webfeaturebrowser/default.htm
(just select the WebHierarchicalDataSource -> Self-Refrencing example from the navigational menu on the left) - full source code is provided there as well, e.g.
<ignav:UltraWebTree ID="UltraWebTree1" runat="server" DataSourceID="WebHierarchicalDataSource1" DefaultImage="" HoverClass="" Indentation="20" StyleSetName="LucidDream" BackColor="#FCFCFC" BorderColor="#E2F2FC" BorderStyle="Solid" BorderWidth="1px" Width="250px" EnableAppStyling="True" ExpandOnClick="True" SingleBranchExpand="True" InitialExpandDepth="2" > <DataBindings> <ignav:NodeBinding DataMember="AccessDataSource1_DefaultView" TextField="LastName" /> </DataBindings> </ignav:UltraWebTree> <aikido:WebHierarchicalDataSource ID="WebHierarchicalDataSource1" runat="server"> <DataRelations> <aikido:DataRelation ChildColumns="ReportsTo" ChildDataViewID="AccessDataSource1_DefaultView" ParentColumns="EmployeeID" ParentDataViewID="AccessDataSource1_DefaultView" /> </DataRelations> <DataViews> <aikido:DataView ID="AccessDataSource1_DefaultView" DataMember="DefaultView" DataSourceID="AccessDataSource1" /> </DataViews> </aikido:WebHierarchicalDataSource> <asp:AccessDataSource ID="AccessDataSource1" runat="server" DataFile="~/App_Data/Nwind.mdb" SelectCommand="SELECT [EmployeeID], [LastName], [FirstName], [ReportsTo] FROM [Employees]"></asp:AccessDataSource>
Hope this helps.
Hallo Rumen
Thx for the fast reply, this is exactly what i'm looking for, i've tried http://devcenter.infragistics.com/Support/KnowledgeBaseArticle.aspx?ArticleID=10087 and it working just fine, thx for your support :)
========================================
I want to ask another questions, maybe it seems silly, before this i use TreeView component that ASP.NET provide,it store text and value when i construct it
TreeNode tn = new TreeNode(text, value);
value contains the ID, and text contains its NAME, so when i click the node, i can identify it from its value
If using UltraWebGrid i haven't found out in what property at Node should i put the ID value , i'm planning on using tag attributes, but somehow e.Node.DataItem always have null value :( .
protected void Tree_NodeBound(object sender, WebTreeNodeEventArgs e){ DataRowView drv = e.Node.DataItem as DataRowView;
e.Node.Tag = drv["ID"].ToString();
}
======================>>>>>
hehe, i already found out how, it can be done when declaring the column name, but i still don't know why e.Node.DataItem is null
for (int i = 0; i < 50; i++){ this.UltraWebTree1.Levels[i].ColumnName = "Name"; this.UltraWebTree1.Levels[i].RelationName = "r1"; this.UltraWebTree1.Levels[i].LevelKeyField = "ID";}
Thanks for the follow-up. The problem is that in NodeBound the e.Node.DataItem parameter is of type DataRow, instead of what you are used to from the stock built-in asp:treeview compoment (DataRowView). That is why your case from to DataRowView return null.
The solution is something like this:
protected void UltraWebTree1_NodeBound(object sender, WebTreeNodeEventArgs e) { DataRow row = e.Node.DataItem as DataRow; int rowIndex = row.Table.Rows.IndexOf(row); DataRowView rowView = row.Table.DefaultView[rowIndex]; e.Node.Tag = rowView["Name"]; }
Please, let me now if this helps.
but e.Node.DataItem itself already null, i am using infragistics 7.2
ps: my code is similar with this thread http://news.infragistics.com/forums/t/9197.aspx at picture that ivan provides
http://news.infragistics.com/forums/storage/122/39245/BindTreeToDataset.rar
=============================================>>>>>>>>>>>>>
and by the way i found another issue, i don't know it is bug or not. I want to cancel the changes when user edit the nodes, using javascript that provides
function BeforeNodeUpdate(treeId , nodeId, newValue ){
//TODO: check to server whether the name is exists and valid, if true then accept changes and update to database.
return true; }
the changes did canceled, but after that when i click another nodes it error in this part
function igtree_endedit(accept) { ...... eParent.removeChild(igtree_editControl); ......
because the eParent already null, am i missing something?
===========================================================>>>>>>>>>>>>>>>>>
another one is about backslash( \ ) charachter, when i'm editing the node at the end of it i add \ characther it will result error in
function igtree_fireEvent(tn,eventObj,eventString){ var ts=igtree_treeState[tn]; var result=false; if(eventObj[0]!="") result=eval(eventObj[0]+eventString); //===============>>> unterminated string constant
if(ts.TreeLoaded && result!=true && eventObj[1]==1 && !ts.CancelPostBack) igtree_needPostBack(tn); ts.CancelPostBack=false; return result;}
Haloo Rumen,
I've tried version 8.2 and the DataItem works fine, I think it really is problems for version 7.2
hmm maybe, i'll post it at the support tomorrow, rumen thx for your support, i hope you're not bored helping me again some other time :)
Well, I really do not know, I am running this again and again and it is working for me. Could this be a version thing? I am trying with 8.1 release. In this case, maybe you can send the same solution to Developer Support and they can probably verify this and provide some suggestions.
Hallo Rumen,
About the code you gave me regarding to DataItem, I have try it exactly what you told me, and the result is the same
DataRow row = e.Node.DataItem as DataRow;
it still returns null, maybe there are some property in UltraWebTree that must be set?below this is a definition of my webtree
<ignav:UltraWebTree ID="tree" runat="server" Font-Names="verdana" Font-Size="8pt" DataKeyOnClient="true" AllowDrag="True" AllowDrop="True" Cursor="Hand" Editable="True" ExpandAnimation="None" InitialExpandDepth="1" WebTreeTarget="ClassicTree" DefaultImage="./img/ig_treeXPFolderClosed.GIF" DefaultSelectedImage="./img/ig_treeXPFolderOpen.gif" HiliteClass="" HoverClass="" Indentation="20" OnNodeAdded="Tree_NodeAdded" OnNodeBound="Tree_NodeBound" OnDataBound="Tree_DataBound" > <ClientSideEvents BeforeNodeUpdate="BeforeNodeUpdate" EditKeyUp="EditKeyUp" EditKeyDown="EditKeyDown" /> <Images> <RootNodeImage Url="./img/MyComputer.gif" /> <DefaultImage Url="./img/ig_treeXPFolderClosed.GIF" /> <SelectedImage Url="./img/ig_treeXPFolderOpen.gif" /> </Images> <NodeEditStyle Font-Names="Verdana" Font-Size="7pt" Height="100px" Cursor="Default"> <Margin Bottom="0px" Left="0px" /> </NodeEditStyle> </ignav:UltraWebTree>
Yes, unfortunately I was able to reproduce both client-side problems - returning False from the BeforeNodeUpdate handler works fine initially and the old text is restored, however the javascript error does occur on subsequent click. There might be a workaround for that, where you handle the After event and if the new text is something you do no like, you can use the client-side node setText method to set the text of the node to the old one.
I also was able to reproduce the "\" backslash node-editing problem. For this one I was not able to find a workaround unofrtunately.
I believe that in this case, the best way is to contact directly our official Developer Support department via this link and report both issues
http://ko.infragistics.com/gethelp/default.aspx
If this is really a bug (like you and I think), it will be logged with a status number number and you will be able to track its status, or if we are lucky, our Developer Support folks will know what is going on and propose a working solution.