I can create this RadTreeList with a parent and child key from a table.
However I have the following structure --
Table 1
-----------
ParentId_1 SomeData
1 <abc>
2 <abc>
Table 2
-----------------
ParentId_2 ParentId_1 Child_Id
Null 1 2147
2147 1 2176
2176 1 2179
2176 1 2180
Null 2 5283
5283 2 20131 etc.
I need a result that looks like --
> 1
> 2147
> 2176
>2179
>2180
>2
> 5283
>20131
What I am getting is this--
> 1
> 2147
> 2176
>2179
>2180
> 5283
>20131
> 2
> 2147
> 2176
>2179
>2180
> 5283
>20131
Is it possible to get the result that I want with data separated in two tables?
If not, can you suggest an alternative?
Thanks
Raka
9 Answers, 1 is accepted
Note that the RadTreeList control is intended to work with self-referencing hierarchical data. Check out the following article that describes the structure of the control in more detail. If you would like to use RadTreeList you would need to arrange the data so that it can be read correctly by the control.
In case you have multiple tables with hierarchical relations you could use the RadGrid to display the data. The main table will be displayed in the MasterTableView and other data will be shown in DetailTables. The example below illustrates how you can show hierarchical data with RadGrid.
Regards,
Viktor Tachev
Telerik
Thank you for your reply, Viktor.
I managed to do this with a RadTreeList nested inside a Grid. But now I am having problems expanding/collapsing the rows.
So I have
Item1
> Item 11
> Item 111
> Item 112
> Item 22
> Item 221
Item2
> ...
etc. I want to be able to collapse Item11 etc. but when I try to collapse Item11, it collapses both Item 11 and 22 and then expanding doesn't work. Another try produced a really bad result where re-expanding Item11, created the whole RadTreeList under Item1 and left remaining untouched;
How do I expand/collapse a treeList that is inside a grid?
Thanks
Sandhia
If you are placing a RadTreeList inside RadGrid please ensure that you use an approach similar to the one in the following online example.
- http://demos.telerik.com/aspnet-ajax/grid/examples/hierarchy/hierarchy-with-templates/defaultcs.aspx
Regards,
Viktor Tachev
Telerik
I am able to use this example to structure the RadTreeList inside RadGrid.
<telerik:RadGrid ID="rgPeople" runat="server" AutoGenerateColumns="False" AllowMultiRowSelection="true"
OnItemCommand="rgPeople_ItemCommand" ClientSettings-AllowExpandCollapse="true" ClientSettings-ClientEvents-OnHierarchyExpanded=""
OnPreRender="rgPeople_PreRender" OnNeedDataSource="rgPeople_NeedDataSource"
AllowSorting="false" AllowPaging="false" ShowFooter="false" PageSize="100" BorderStyle="None">
<ClientSettings>
<Selecting AllowRowSelect="True" EnableDragToSelectRows="false"></Selecting>
<Scrolling AllowScroll="True" SaveScrollPosition="True" UseStaticHeaders="true">
</Scrolling>
</ClientSettings>
<MasterTableView DataKeyNames="DirId, IsDeletable" ClientDataKeyNames="DirId"
AllowMultiColumnSorting="false" BorderStyle="None" HierarchyLoadMode="Client"
HierarchyDefaultExpanded="true" EnableNoRecordsTemplate="true" NoDetailRecordsText="" Name="People">
<NoRecordsTemplate>
<div style="display:none; visibility:hidden; background-color: blue;"></div>
</NoRecordsTemplate>
<PagerStyle Mode="NextPrevAndNumeric" AlwaysVisible="true"></PagerStyle>
<NestedViewSettings>
<ParentTableRelation>
<telerik:GridRelationFields DetailKeyField="DirId" MasterKeyField="DirId" />
</ParentTableRelation>
</NestedViewSettings>
<NestedViewTemplate>
<div style="background-color: #d9d9d9; padding: 0px 25px 0px 25px;">
<telerik:RadTreeList RenderMode="Classic" ID="RadTreeList1" runat="server" DataKeyNames="PersonId" ParentDataKeyNames="ParentId"
AllowPaging="false" OnNeedDataSource="RadTreeList1_NeedDataSource" OnItemDataBound="RadTreeList1_ItemDataBound" OnPreRender="RadTreeList1_PreRender"
AutoGenerateColumns="false" ExpandCollapseMode="Client" AllowMultiItemSelection="true" >
<ClientSettings>
<Selecting AllowItemSelection="true" AllowToggleSelection="true" />
<ClientEvents OnItemSelected="getSelectedItems" />
</ClientSettings>
<Columns>
<telerik:TreeListSelectColumn UniqueName="ClientSelectColumn" ItemStyle-Width="25px" HeaderStyle-Width="25px" />
...
However I still have problems.
1) On initial load, everything is collapsed. I want them to come up all expanded. If I try doing ExpandAll in PreRender, it does come up all expanded but now collapsing and expanding items does strange things to data. So, the first question is how to do this correctly?
2) How do I get the value of selected node in JavaScript?
Thank you
Raka
You can expand all items in the grid by setting HierarchyDefaultExpanded property to true.
<
MasterTableView
HierarchyDefaultExpanded
=
"true"
>
If you still experience some issues I would appreciate if you can provide more detailed information.
Regards your second question when you want to get the selected item values. If you want do that on ItemSelected client event then you can get the values from the event arguments. Please check out the following help article for more information about TreeListDataItem client object.
Regards,
Kostadin
Telerik
I have already tried hierarchydefaultexpanded=true but while it opens everything up on load, it does not work correctly if I collapse a node and re-expand. I mentioned this in my earlier post.
Also I have given most of the code that I have in aspx. Just haven't given all columns/data.
May be it cannot be resolved.
Thank you
Raka
I prepared a small sample and attached it to this thread. Please check it out and let me know how it differs from your real setup? I would appreciate if you can provide a small sample where the issue could be observed in order to investigate the caused for this issue further.
Regards,
Kostadin
Telerik
Hello Kostadin
Thank you so much for the code. I have it working now. I was using a UserControl for RadTreeList but for some reason the expand/collapse does not work that way. So, I extracted the code and inserted it in its place (the way you have it), and it works! Thank you so very much.
One more small question. You have a '<ClientEvents OnItemSelected="getSelectedItems" /> in your definition of RadTreeList. But I don't see a definition. Can you show me how to write this? I need to be able to select an item and do something with them.
Thank you
Raka
I am not using the OnItemSelected event in my case and I assume is left from copying your TreeList declaration. Nevertheless, you can get the item from the event argument and get the cells values.
Regards,
Kostadin
Telerik