Example of Cell Edit Type in Javascript Tree Grid Control

All Controls
/
Tree Grid
/
Cell Edit Type

This sample demonstrates the supported cell edit types of Tree Grid columns. The list of cell edit types are as follows,

  • NumericTextBox component for integers, double, and decimal data types.
  • TextBox component for string data type.
  • DropDownList component for list data type.
  • DatePicker component for date data type.
  • DateTimePicker component for dateTime data type.
  • Checkbox component for boolean data type
More Details...

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

The columns.editType is used to customize the edit type of the particular column. You can set the columns.editType based on data type of the column. In this sample, we show the following editTypes for the Tree Grid columns NumericTextBox TextBox DropDownList DatePicker DateTimePicker Checkbox Injecting Module: Tree Grid features are segregated into individual feature-wise modules. To use editing feature, we need to inject Edit module using the TreeGrid.Inject(Edit) method.