Example of Default Functionalities in ASP.NET MVC Tree Grid Control
This sample demonstrates the default rendering of the Tree Grid with minimum configuration.
Task ID | Task Name | Start Date | End Date | Duration | Progress |
---|---|---|---|---|---|
1 | Planning | 6/7/2016 | 8/25/2021 | 5 | 100 |
2 | Plan timeline | 6/7/2016 | 8/25/2021 | 5 | 100 |
3 | Plan budget | 6/7/2016 | 8/25/2021 | 5 | 100 |
4 | Allocate resources | 6/7/2016 | 8/25/2021 | 5 | 100 |
5 | Planning complete | 8/25/2021 | 8/25/2021 | 3 | 25 |
6 | Design | 8/25/2021 | 6/27/2024 | 3 | 86 |
7 | Software Specification | 8/25/2021 | 6/27/2024 | 3 | 60 |
8 | Develop prototype | 8/25/2021 | 6/27/2024 | 3 | 100 |
9 | Get approval from customer | 6/27/2024 | 6/27/2024 | 2 | 100 |
10 | Design complete | 6/27/2024 | 6/27/2024 | 3 | 25 |
11 | Implementation Phase | 2/17/2017 | 2/17/2017 | 11 | 25 |
12 | Phase 1 | 2/17/2017 | 2/27/2017 | 11 | 25 |
13 | Implementation Module 1 | 2/17/2017 | 2/27/2017 | 11 | 25 |
14 | Development Task 1 | 2/17/2017 | 2/19/2017 | 3 | 50 |
15 | Development Task 2 | 2/17/2017 | 2/19/2017 | 3 | 50 |
16 | Testing | 2/20/2017 | 2/21/2017 | 2 | 25 |
17 | Bug fix | 2/24/2017 | 2/25/2017 | 2 | 25 |
18 | Customer review meeting | 2/26/2017 | 2/27/2017 | 2 | 25 |
19 | Phase 1 complete | 2/27/2017 | 2/27/2017 | 2 | 25 |
20 | Phase 2 | 2/17/2017 | 2/28/2017 | 12 | 25 |
21 | Implementation Module 2 | 2/17/2017 | 2/28/2017 | 12 | 25 |
22 | Development Task 1 | 2/17/2017 | 2/20/2017 | 4 | 50 |
23 | Development Task 2 | 2/17/2017 | 2/20/2017 | 4 | 50 |
24 | Testing | 2/21/2017 | 2/24/2017 | 2 | 25 |
25 | Bug fix | 2/25/2017 | 2/26/2017 | 2 | 25 |
26 | Customer review meeting | 2/27/2017 | 2/28/2017 | 2 | 25 |
27 | Phase 2 complete | 2/28/2017 | 2/28/2017 | 2 | 25 |
28 | Phase 3 | 2/17/2017 | 2/27/2017 | 11 | 25 |
29 | Implementation Module 3 | 2/17/2017 | 2/27/2017 | 11 | 25 |
30 | Development Task 1 | 2/17/2017 | 2/19/2017 | 3 | 50 |
31 | Development Task 2 | 2/17/2017 | 2/19/2017 | 3 | 50 |
32 | Testing | 2/20/2017 | 2/21/2017 | 2 | 25 |
33 | Bug fix | 2/24/2017 | 2/25/2017 | 2 | 25 |
34 | Customer review meeting | 2/26/2017 | 2/27/2017 | 2 | 25 |
35 | Phase 3 complete | 2/27/2017 | 2/27/2017 | 2 | 25 |
The Tree Grid is used to represent the hierarchical data in a tabular format,
combining the visual representation of Grid and TreeView controls.
It represents the data from Datasource
. Such as an array of JSON objects, OData web services, or
DataManager
binding data fields to columns or self-referential datasource.
In this demo, the Tree Grid is populated with its minimum default settings. More information on the Tree Grid instantiation can be found in this documentation sectionopens in a new tab.