Example of Frozen Columns in ASP.NET Core Tree Grid Control

Tree Grid

Scrolling

Frozen Columns

This sample demonstrates the frozen columns feature of the TreeGrid. Scroll the movable content horizontally to view the frozen columns with the content.

Task ID

Task Name

Start Date

End Date

Duration

Progress

Priority

Approved

TreeGrid_gridcontrol_header_table

1	Planning	3/2/2017	7/2/2017	5	100	Normal	false
2	Plan timeline	3/2/2017	7/2/2017	5	100	Normal	false
3	Plan budget	3/2/2017	7/2/2017	5	100	Low	true
4	Allocate resources	3/2/2017	7/2/2017	5	100	Critical	false
5	Planning complete	7/2/2017	7/2/2017	1	1	Low	true
6	Design	10/2/2017	2/14/2017	3	86	High	false
7	Software Specification	10/2/2017	2/12/2017	3	60	Normal	false
8	Develop prototype	10/2/2017	2/12/2017	3	100	Critical	false
9	Get approval from customer	2/13/2017	2/14/2017	2	100	Low	true
10	Design complete	2/14/2017	2/14/2017	1	1	Normal	true
11	Implementation Phase	2/17/2017	2/17/2017	11	66	Normal	false
12	Phase 1	2/17/2017	2/27/2017	11	50	High	false
13	Implementation Module 1	2/17/2017	2/27/2017	11	10	Normal	false
14	Development Task 1	2/17/2017	2/19/2017	3	50	High	false
15	Development Task 2	2/17/2017	2/19/2017	3	50	Low	true
16	Testing	2/20/2017	2/21/2017	2	1	Normal	true
17	Bug fix	2/24/2017	2/25/2017	2	1	Critical	false
18	Customer review meeting	2/26/2017	2/27/2017	2	1	High	false
19	Phase 1 complete	2/27/2017	2/27/2017	2	50	Low	true
20	Phase 2	2/17/2017	2/28/2017	12	60	High	false
21	Implementation Module 2	2/17/2017	2/28/2017	12	90	Critical	false
22	Development Task 1	2/17/2017	2/20/2017	4	50	Normal	true
23	Development Task 2	2/17/2017	2/20/2017	4	50	Critical	true
24	Testing	2/21/2017	2/24/2017	2	1	High	false
25	Bug fix	2/25/2017	2/26/2017	2	1	Low	false
26	Customer review meeting	2/27/2017	2/28/2017	2	1	Critical	true
27	Phase 2 complete	2/28/2017	2/28/2017	2	50	Normal	false
28	Phase 3	2/17/2017	2/27/2017	11	30	Normal	false
29	Implementation Module 3	2/17/2017	2/27/2017	11	60	High	false
30	Development Task 1	2/17/2017	2/19/2017	3	50	Low	true
31	Development Task 2	2/17/2017	2/19/2017	3	50	Normal	false
32	Testing	2/20/2017	2/21/2017	2	1	Critical	true
33	Bug fix	2/24/2017	2/25/2017	2	1	High	false
34	Customer review meeting	2/26/2017	2/27/2017	2	1	Normal	true
35	Phase 3 complete	2/27/2017	2/27/2017	2	50	Critical	false

The freezing feature enables the user to freeze certain columns to scroll remaining movable content. This can be achieved by setting frozenColumns property.

In this demo sample, the first two columns is set to frozen by using the frozenColumns properties.

DefaultScrolling

Example of Frozen Columns in ASP.NET Core Tree Grid Control