FlexGrid

FlexGrid allows you to visualize and edit tabular data. It provides a variety of options about how to present and perform operations over the data, including selection, sorting, filtering, grouping, paging, editing, formatting, etc.

Populate the FlexGrid by setting its itemsSource property to an array containing regular JavaScript objects. The grid will automatically generate columns to display the data items, and will allow users to select, sort, and edit the data.

Id
Country
Active
Downloads
Sales
Expenses
0
US
119,362
21,994.63
7,679.04
1
Germany
150,451
70,403.11
40,805.06
2
UK
51,997
62,123.20
6,616.11
3
Japan
137,671
56,357.24
38,951.06
4
Italy
182,280
29,275.36
7,916.08
5
Greece
103,677
42,994.10
30,715.06
6
US
190,285
27,937.55
23,254.30
7
Germany
119,028
52,339.17
8,973.95
8
UK
176,516
94,761.08
7,703.13
9
Japan
179,366
83,581.21
1,191.15
10
Italy
86,240
2,286.82
20,332.96
11
Greece
65,235
70,424.83
14,369.30
12
US
100,828
76,551.08
28,740.06
13
Germany
28,627
24,844.57
18,205.14
14
UK
61,356
72,789.69
12,684.25
15
Japan
117,009
3,120.58
21,078.72
16
Italy
102,920
80,565.69
35,403.82
17
Greece
64,303
15,690.07
10,750.76
18
US
57,779
8,042.78
49,566.12
19
Germany
172,953
99,041.98
7,038.61
20
UK
145,736
73,932.28
5,183.72
21
Japan
198,867
23,265.09
3,620.37
22
Italy
181,110
8,189.21
2,866.24
23
Greece
120,830
50,164.07
11,674.29
24
US
158,133
80,532.99
25,038.39
25
Germany
168,579
27,259.91
3,208.83
26
UK
186,872
40,018.23
28,642.64
27
Japan
124,326
63,886.94
8,845.53
28
Italy
20,440
62,772.84
40,974.91
29
Greece
197,170
19,443.68
49,485.06
30
US
187,466
44,270.81
8,355.64
31
Germany
17,987
80,344.19
42,853.97
32
UK
15,657
97,275.76
18,612.08
33
Japan
43,188
68,141.35
44,680.53
34
Italy
113,860
46,091.82
31,762.92
35
Greece
117,588
79,424.57
33,960.73
36
US
120,274
55,519.29
31,711.87
37
Germany
139,114
46,828.33
44,785.11
38
UK
89,867
40,527.28
20,463.19
39
Japan
24,285
7,892.64
5,865.53
40
Italy
35,141
25,334.15
47,523.76
41
Greece
51,413
28,442.53
48,654.98
42
US
47,063
21,289.00
32,542.00
43
Germany
150,147
90,470.74
23,352.10
44
UK
133,237
24,742.66
29,094.99
45
Japan
194,519
84,711.85
7,675.22
46
Italy
96,089
58,156.08
7,042.10
47
Greece
32,885
65,626.31
12,938.96
48
US
156,680
3,660.17
27,843.66
49
Germany
84,549
83,207.66
18,005.36
50
UK
78,789
83,993.76
21,829.85
51
Japan
180,149
8,173.83
30,918.62
52
Italy
133,936
76,849.14
39,808.63
53
Greece
11,545
63,012.29
1,094.04
54
US
107,083
10,383.71
16,755.87
55
Germany
33,183
22,192.64
5,836.34
56
UK
140,991
27,611.96
41,606.12
57
Japan
197,366
95,394.66
970.98
58
Italy
22,872
31,638.34
23,833.53
59
Greece
56,108
98,698.63
42,347.39
60
US
148,450
63,356.53
13,176.92
61
Germany
46,848
38,229.35
6,948.40
62
UK
90,322
19,631.18
45,158.15
63
Japan
66,034
76,327.96
23,534.78
64
Italy
167,446
11,138.17
35,235.37
65
Greece
38,012
19,983.34
8,300.67
66
US
71,030
22,742.53
43,072.82
67
Germany
181,821
84,910.44
25,026.80
68
UK
168,737
10,832.84
49,673.12
69
Japan
102,778
63,505.90
14,398.71
70
Italy
41,897
47,955.69
10,382.72
71
Greece
28,254
85,200.41
7,875.53
72
US
25,610
2,120.61
47,999.39
73
Germany
77,240
89,139.41
32,237.15
74
UK
37,879
99,585.25
49,473.03
75
Japan
167,193
6,299.80
39,268.02
76
Italy
52,431
61,304.73
47,585.63
77
Greece
41,183
65,703.93
19,421.02
78
US
17,950
50,466.24
21,127.47
79
Germany
96,595
80,410.82
43,212.62
80
UK
152,340
986.29
15,991.66
81
Japan
105,973
8,174.79
36,728.75
82
Italy
144,987
46,871.50
21,044.82
83
Greece
196,016
75,873.80
24,983.54
84
US
22,990
31,371.51
650.22
85
Germany
85,787
48,405.55
25,461.67
86
UK
97,924
83,540.89
49,163.56
87
Japan
52,645
37,566.28
4,959.23
88
Italy
86,097
82,136.10
27,698.57
89
Greece
167,589
63,357.05
32,832.61
90
US
122,699
32,573.00
22,319.22
91
Germany
146,581
87,834.18
39,250.35
92
UK
131,466
55.35
14,480.56
93
Japan
163,545
42,251.10
5,572.22
94
Italy
100,922
81,456.19
12,548.68
95
Greece
18,693
38,928.42
48,343.08
96
US
31,760
53,777.17
7,230.78
97
Germany
170,514
33,327.86
44,806.70
98
UK
146,487
408.11
46,280.15
99
Japan
58,565
89,127.85
48,289.48
100
Italy
9,928
55,324.75
49,002.16
101
Greece
18,639
27,540.99
47,435.85
102
US
189,547
80,400.04
5,013.09
103
Germany
189,833
56,334.04
30,804.05
104
UK
21,300
55,777.99
35,962.85
105
Japan
18,822
21,615.30
16,724.39
106
Italy
103,262
70,082.88
6,567.31
107
Greece
154,182
79,322.24
39,912.27
108
US
33,047
21,627.14
15,717.81
109
Germany
192,352
95,973.28
19,496.36
110
UK
179,892
90,669.92
29,049.53
111
Japan
97,332
310.71
3,256.30
112
Italy
24,973
92,220.70
18,437.60
113
Greece
99,971
36,556.92
41,827.17
114
US
108,645
4,124.49
9,856.10
115
Germany
187,833
55,709.51
4,999.22
116
UK
141,997
96,611.05
47,430.50
117
Japan
124,107
98,627.57
12,062.36
118
Italy
180,142
26,577.71
25,184.47
119
Greece
5,098
28,219.18
21,102.65
120
US
81,508
8,195.96
13,693.43
121
Germany
26,881
2,151.58
8,063.14
122
UK
190,740
56,505.45
47,138.02
123
Japan
142,315
18,096.39
34,934.12
124
Italy
104,335
43,741.95
2,494.53
125
Greece
104,384
93,538.36
47,634.65
126
US
84,519
16,623.43
17,043.94
127
Germany
93,910
87,584.06
49,850.41
128
UK
158,567
45,049.11
48,527.84
129
Japan
148,324
44,326.61
7,386.13
130
Italy
151,520
51,095.98
3,403.08
131
Greece
87,668
32,410.11
19,552.64
132
US
114,288
34,592.68
21,035.53
133
Germany
143,237
25,379.06
25,925.36
134
UK
139,399
97,185.61
42,559.70
135
Japan
18,351
84,378.36
12,869.13
136
Italy
57,751
59,551.02
49,472.27
137
Greece
152,771
27,303.39
37,027.40
138
US
116,374
13,729.02
47,382.95
139
Germany
44,976
18,402.19
35,903.45
140
UK
117,846
44,459.87
21,250.49
141
Japan
61,369
7,501.50
34,685.25
142
Italy
169,679
19,877.77
26,106.55
143
Greece
148,706
85,229.13
36,020.24
144
US
17,773
7,299.84
36,370.60
145
Germany
130,131
17,764.61
25,151.56
146
UK
106,300
12,619.21
18,366.66
147
Japan
91,388
97,082.70
34,397.20
148
Italy
48,635
30,498.82
18,154.58
149
Greece
128,161
64,831.20
5,162.92
150
US
72,396
32,244.47
47,642.86
151
Germany
81,283
80,381.95
1,854.23
152
UK
67,692
24,706.62
17,901.36
153
Japan
68,607
9,565.64
579.71
154
Italy
195,113
84,809.30
12,379.87
155
Greece
68,402
48,943.85
34,638.16
156
US
120,099
87,851.06
49,356.65
157
Germany
75,312
63,442.84
49,964.94
158
UK
3,411
38,241.83
3,576.05
159
Japan
190,950
9,503.70
35,550.75
160
Italy
155,216
47,885.31
33,298.55
161
Greece
54,184
13,671.37
5,015.48
162
US
31,961
17,569.60
10,499.60
163
Germany
164,406
71,542.46
21,562.30
164
UK
111,469
95,194.04
38,056.01
165
Japan
168,643
24,618.50
40,228.64
166
Italy
93,316
49,522.90
5,326.28
167
Greece
72,645
64,923.65
22,518.14
168
US
187,922
24,348.79
28,018.03
169
Germany
40,666
95,057.51
43,812.78
170
UK
111,386
15,846.02
26,050.75
171
Japan
54,604
15,315.95
33,866.45
172
Italy
150,235
55,944.27
3,405.01
173
Greece
117,569
40,068.68
15,071.64
174
US
51,205
32,287.77
43,832.80
175
Germany
73,811
24,849.33
18,400.30
176
UK
62,474
62,397.81
14,960.01
177
Japan
67,711
63,944.74
15,903.85
178
Italy
76,214
21,511.97
17,810.06
179
Greece
15,651
33,386.48
10,039.77
180
US
48,814
9,987.50
26,336.27
181
Germany
33,284
57,987.20
42,475.34
182
UK
161,068
67,454.99
7,639.17
183
Japan
140,075
86,934.95
24,342.08
184
Italy
10,098
46,534.19
31,243.00
185
Greece
51,119
47,149.40
37,987.26
186
US
70,121
61,478.01
49,113.68
187
Germany
103,713
41,993.54
23,357.25
188
UK
181,692
51,227.48
43,194.70
189
Japan
115,785
92,201.93
18,051.52
190
Italy
191,928
84,768.69
35,235.19
191
Greece
57,538
50,058.61
24,194.63
192
US
73,731
66,316.99
47,819.67
193
Germany
172,140
88,307.40
24,329.50
194
UK
18,446
88,943.19
29,554.90
195
Japan
19,088
3,911.02
24,933.87
196
Italy
157,910
15,630.18
4,179.22
197
Greece
85,914
52,411.78
6,164.09
198
US
18,602
73,568.33
18,706.18
199
Germany
81,351
67,051.69
7,656.40

You can customize the grid columns by setting the autoGenerateColumns property to false and populating the columns property in code.

Country
Downloads (k)
Sales (k)
Expenses (k)
US
119.4
22.0
$7.7
Germany
150.5
70.4
$40.8
UK
52.0
62.1
$6.6
Japan
137.7
56.4
$39.0
Italy
182.3
29.3
$7.9
Greece
103.7
43.0
$30.7
US
190.3
27.9
$23.3
Germany
119.0
52.3
$9.0
UK
176.5
94.8
$7.7
Japan
179.4
83.6
$1.2
Italy
86.2
2.3
$20.3
Greece
65.2
70.4
$14.4
US
100.8
76.6
$28.7
Germany
28.6
24.8
$18.2
UK
61.4
72.8
$12.7
Japan
117.0
3.1
$21.1
Italy
102.9
80.6
$35.4
Greece
64.3
15.7
$10.8
US
57.8
8.0
$49.6
Germany
173.0
99.0
$7.0
UK
145.7
73.9
$5.2
Japan
198.9
23.3
$3.6
Italy
181.1
8.2
$2.9
Greece
120.8
50.2
$11.7
US
158.1
80.5
$25.0
Germany
168.6
27.3
$3.2
UK
186.9
40.0
$28.6
Japan
124.3
63.9
$8.8
Italy
20.4
62.8
$41.0
Greece
197.2
19.4
$49.5
US
187.5
44.3
$8.4
Germany
18.0
80.3
$42.9
UK
15.7
97.3
$18.6
Japan
43.2
68.1
$44.7
Italy
113.9
46.1
$31.8
Greece
117.6
79.4
$34.0
US
120.3
55.5
$31.7
Germany
139.1
46.8
$44.8
UK
89.9
40.5
$20.5
Japan
24.3
7.9
$5.9
Italy
35.1
25.3
$47.5
Greece
51.4
28.4
$48.7
US
47.1
21.3
$32.5
Germany
150.1
90.5
$23.4
UK
133.2
24.7
$29.1
Japan
194.5
84.7
$7.7
Italy
96.1
58.2
$7.0
Greece
32.9
65.6
$12.9
US
156.7
3.7
$27.8
Germany
84.5
83.2
$18.0
UK
78.8
84.0
$21.8
Japan
180.1
8.2
$30.9
Italy
133.9
76.8
$39.8
Greece
11.5
63.0
$1.1
US
107.1
10.4
$16.8
Germany
33.2
22.2
$5.8
UK
141.0
27.6
$41.6
Japan
197.4
95.4
$1.0
Italy
22.9
31.6
$23.8
Greece
56.1
98.7
$42.3
US
148.4
63.4
$13.2
Germany
46.8
38.2
$6.9
UK
90.3
19.6
$45.2
Japan
66.0
76.3
$23.5
Italy
167.4
11.1
$35.2
Greece
38.0
20.0
$8.3
US
71.0
22.7
$43.1
Germany
181.8
84.9
$25.0
UK
168.7
10.8
$49.7
Japan
102.8
63.5
$14.4
Italy
41.9
48.0
$10.4
Greece
28.3
85.2
$7.9
US
25.6
2.1
$48.0
Germany
77.2
89.1
$32.2
UK
37.9
99.6
$49.5
Japan
167.2
6.3
$39.3
Italy
52.4
61.3
$47.6
Greece
41.2
65.7
$19.4
US
17.9
50.5
$21.1
Germany
96.6
80.4
$43.2
UK
152.3
1.0
$16.0
Japan
106.0
8.2
$36.7
Italy
145.0
46.9
$21.0
Greece
196.0
75.9
$25.0
US
23.0
31.4
$0.7
Germany
85.8
48.4
$25.5
UK
97.9
83.5
$49.2
Japan
52.6
37.6
$5.0
Italy
86.1
82.1
$27.7
Greece
167.6
63.4
$32.8
US
122.7
32.6
$22.3
Germany
146.6
87.8
$39.3
UK
131.5
0.1
$14.5
Japan
163.5
42.3
$5.6
Italy
100.9
81.5
$12.5
Greece
18.7
38.9
$48.3
US
31.8
53.8
$7.2
Germany
170.5
33.3
$44.8
UK
146.5
0.4
$46.3
Japan
58.6
89.1
$48.3
Italy
9.9
55.3
$49.0
Greece
18.6
27.5
$47.4
US
189.5
80.4
$5.0
Germany
189.8
56.3
$30.8
UK
21.3
55.8
$36.0
Japan
18.8
21.6
$16.7
Italy
103.3
70.1
$6.6
Greece
154.2
79.3
$39.9
US
33.0
21.6
$15.7
Germany
192.4
96.0
$19.5
UK
179.9
90.7
$29.0
Japan
97.3
0.3
$3.3
Italy
25.0
92.2
$18.4
Greece
100.0
36.6
$41.8
US
108.6
4.1
$9.9
Germany
187.8
55.7
$5.0
UK
142.0
96.6
$47.4
Japan
124.1
98.6
$12.1
Italy
180.1
26.6
$25.2
Greece
5.1
28.2
$21.1
US
81.5
8.2
$13.7
Germany
26.9
2.2
$8.1
UK
190.7
56.5
$47.1
Japan
142.3
18.1
$34.9
Italy
104.3
43.7
$2.5
Greece
104.4
93.5
$47.6
US
84.5
16.6
$17.0
Germany
93.9
87.6
$49.9
UK
158.6
45.0
$48.5
Japan
148.3
44.3
$7.4
Italy
151.5
51.1
$3.4
Greece
87.7
32.4
$19.6
US
114.3
34.6
$21.0
Germany
143.2
25.4
$25.9
UK
139.4
97.2
$42.6
Japan
18.4
84.4
$12.9
Italy
57.8
59.6
$49.5
Greece
152.8
27.3
$37.0
US
116.4
13.7
$47.4
Germany
45.0
18.4
$35.9
UK
117.8
44.5
$21.3
Japan
61.4
7.5
$34.7
Italy
169.7
19.9
$26.1
Greece
148.7
85.2
$36.0
US
17.8
7.3
$36.4
Germany
130.1
17.8
$25.2
UK
106.3
12.6
$18.4
Japan
91.4
97.1
$34.4
Italy
48.6
30.5
$18.2
Greece
128.2
64.8
$5.2
US
72.4
32.2
$47.6
Germany
81.3
80.4
$1.9
UK
67.7
24.7
$17.9
Japan
68.6
9.6
$0.6
Italy
195.1
84.8
$12.4
Greece
68.4
48.9
$34.6
US
120.1
87.9
$49.4
Germany
75.3
63.4
$50.0
UK
3.4
38.2
$3.6
Japan
190.9
9.5
$35.6
Italy
155.2
47.9
$33.3
Greece
54.2
13.7
$5.0
US
32.0
17.6
$10.5
Germany
164.4
71.5
$21.6
UK
111.5
95.2
$38.1
Japan
168.6
24.6
$40.2
Italy
93.3
49.5
$5.3
Greece
72.6
64.9
$22.5
US
187.9
24.3
$28.0
Germany
40.7
95.1
$43.8
UK
111.4
15.8
$26.1
Japan
54.6
15.3
$33.9
Italy
150.2
55.9
$3.4
Greece
117.6
40.1
$15.1
US
51.2
32.3
$43.8
Germany
73.8
24.8
$18.4
UK
62.5
62.4
$15.0
Japan
67.7
63.9
$15.9
Italy
76.2
21.5
$17.8
Greece
15.7
33.4
$10.0
US
48.8
10.0
$26.3
Germany
33.3
58.0
$42.5
UK
161.1
67.5
$7.6
Japan
140.1
86.9
$24.3
Italy
10.1
46.5
$31.2
Greece
51.1
47.1
$38.0
US
70.1
61.5
$49.1
Germany
103.7
42.0
$23.4
UK
181.7
51.2
$43.2
Japan
115.8
92.2
$18.1
Italy
191.9
84.8
$35.2
Greece
57.5
50.1
$24.2
US
73.7
66.3
$47.8
Germany
172.1
88.3
$24.3
UK
18.4
88.9
$29.6
Japan
19.1
3.9
$24.9
Italy
157.9
15.6
$4.2
Greece
85.9
52.4
$6.2
US
18.6
73.6
$18.7
Germany
81.4
67.1
$7.7

You can customize the default features of grid by setting the properties such as selectionMode, allowSorting, allowDragging, isReadOnly and headersVisibility.

Id
Country
Active
Downloads
Sales
Expenses
0
US
119,362
21,994.63
7,679.04
1
Germany
150,451
70,403.11
40,805.06
2
UK
51,997
62,123.20
6,616.11
3
Japan
137,671
56,357.24
38,951.06
4
Italy
182,280
29,275.36
7,916.08
5
Greece
103,677
42,994.10
30,715.06
6
US
190,285
27,937.55
23,254.30
7
Germany
119,028
52,339.17
8,973.95
8
UK
176,516
94,761.08
7,703.13
9
Japan
179,366
83,581.21
1,191.15
10
Italy
86,240
2,286.82
20,332.96
11
Greece
65,235
70,424.83
14,369.30
12
US
100,828
76,551.08
28,740.06
13
Germany
28,627
24,844.57
18,205.14
14
UK
61,356
72,789.69
12,684.25
15
Japan
117,009
3,120.58
21,078.72
16
Italy
102,920
80,565.69
35,403.82
17
Greece
64,303
15,690.07
10,750.76
18
US
57,779
8,042.78
49,566.12
19
Germany
172,953
99,041.98
7,038.61
20
UK
145,736
73,932.28
5,183.72
21
Japan
198,867
23,265.09
3,620.37
22
Italy
181,110
8,189.21
2,866.24
23
Greece
120,830
50,164.07
11,674.29
24
US
158,133
80,532.99
25,038.39
25
Germany
168,579
27,259.91
3,208.83
26
UK
186,872
40,018.23
28,642.64
27
Japan
124,326
63,886.94
8,845.53
28
Italy
20,440
62,772.84
40,974.91
29
Greece
197,170
19,443.68
49,485.06
30
US
187,466
44,270.81
8,355.64
31
Germany
17,987
80,344.19
42,853.97
32
UK
15,657
97,275.76
18,612.08
33
Japan
43,188
68,141.35
44,680.53
34
Italy
113,860
46,091.82
31,762.92
35
Greece
117,588
79,424.57
33,960.73
36
US
120,274
55,519.29
31,711.87
37
Germany
139,114
46,828.33
44,785.11
38
UK
89,867
40,527.28
20,463.19
39
Japan
24,285
7,892.64
5,865.53
40
Italy
35,141
25,334.15
47,523.76
41
Greece
51,413
28,442.53
48,654.98
42
US
47,063
21,289.00
32,542.00
43
Germany
150,147
90,470.74
23,352.10
44
UK
133,237
24,742.66
29,094.99
45
Japan
194,519
84,711.85
7,675.22
46
Italy
96,089
58,156.08
7,042.10
47
Greece
32,885
65,626.31
12,938.96
48
US
156,680
3,660.17
27,843.66
49
Germany
84,549
83,207.66
18,005.36
50
UK
78,789
83,993.76
21,829.85
51
Japan
180,149
8,173.83
30,918.62
52
Italy
133,936
76,849.14
39,808.63
53
Greece
11,545
63,012.29
1,094.04
54
US
107,083
10,383.71
16,755.87
55
Germany
33,183
22,192.64
5,836.34
56
UK
140,991
27,611.96
41,606.12
57
Japan
197,366
95,394.66
970.98
58
Italy
22,872
31,638.34
23,833.53
59
Greece
56,108
98,698.63
42,347.39
60
US
148,450
63,356.53
13,176.92
61
Germany
46,848
38,229.35
6,948.40
62
UK
90,322
19,631.18
45,158.15
63
Japan
66,034
76,327.96
23,534.78
64
Italy
167,446
11,138.17
35,235.37
65
Greece
38,012
19,983.34
8,300.67
66
US
71,030
22,742.53
43,072.82
67
Germany
181,821
84,910.44
25,026.80
68
UK
168,737
10,832.84
49,673.12
69
Japan
102,778
63,505.90
14,398.71
70
Italy
41,897
47,955.69
10,382.72
71
Greece
28,254
85,200.41
7,875.53
72
US
25,610
2,120.61
47,999.39
73
Germany
77,240
89,139.41
32,237.15
74
UK
37,879
99,585.25
49,473.03
75
Japan
167,193
6,299.80
39,268.02
76
Italy
52,431
61,304.73
47,585.63
77
Greece
41,183
65,703.93
19,421.02
78
US
17,950
50,466.24
21,127.47
79
Germany
96,595
80,410.82
43,212.62
80
UK
152,340
986.29
15,991.66
81
Japan
105,973
8,174.79
36,728.75
82
Italy
144,987
46,871.50
21,044.82
83
Greece
196,016
75,873.80
24,983.54
84
US
22,990
31,371.51
650.22
85
Germany
85,787
48,405.55
25,461.67
86
UK
97,924
83,540.89
49,163.56
87
Japan
52,645
37,566.28
4,959.23
88
Italy
86,097
82,136.10
27,698.57
89
Greece
167,589
63,357.05
32,832.61
90
US
122,699
32,573.00
22,319.22
91
Germany
146,581
87,834.18
39,250.35
92
UK
131,466
55.35
14,480.56
93
Japan
163,545
42,251.10
5,572.22
94
Italy
100,922
81,456.19
12,548.68
95
Greece
18,693
38,928.42
48,343.08
96
US
31,760
53,777.17
7,230.78
97
Germany
170,514
33,327.86
44,806.70
98
UK
146,487
408.11
46,280.15
99
Japan
58,565
89,127.85
48,289.48
100
Italy
9,928
55,324.75
49,002.16
101
Greece
18,639
27,540.99
47,435.85
102
US
189,547
80,400.04
5,013.09
103
Germany
189,833
56,334.04
30,804.05
104
UK
21,300
55,777.99
35,962.85
105
Japan
18,822
21,615.30
16,724.39
106
Italy
103,262
70,082.88
6,567.31
107
Greece
154,182
79,322.24
39,912.27
108
US
33,047
21,627.14
15,717.81
109
Germany
192,352
95,973.28
19,496.36
110
UK
179,892
90,669.92
29,049.53
111
Japan
97,332
310.71
3,256.30
112
Italy
24,973
92,220.70
18,437.60
113
Greece
99,971
36,556.92
41,827.17
114
US
108,645
4,124.49
9,856.10
115
Germany
187,833
55,709.51
4,999.22
116
UK
141,997
96,611.05
47,430.50
117
Japan
124,107
98,627.57
12,062.36
118
Italy
180,142
26,577.71
25,184.47
119
Greece
5,098
28,219.18
21,102.65
120
US
81,508
8,195.96
13,693.43
121
Germany
26,881
2,151.58
8,063.14
122
UK
190,740
56,505.45
47,138.02
123
Japan
142,315
18,096.39
34,934.12
124
Italy
104,335
43,741.95
2,494.53
125
Greece
104,384
93,538.36
47,634.65
126
US
84,519
16,623.43
17,043.94
127
Germany
93,910
87,584.06
49,850.41
128
UK
158,567
45,049.11
48,527.84
129
Japan
148,324
44,326.61
7,386.13
130
Italy
151,520
51,095.98
3,403.08
131
Greece
87,668
32,410.11
19,552.64
132
US
114,288
34,592.68
21,035.53
133
Germany
143,237
25,379.06
25,925.36
134
UK
139,399
97,185.61
42,559.70
135
Japan
18,351
84,378.36
12,869.13
136
Italy
57,751
59,551.02
49,472.27
137
Greece
152,771
27,303.39
37,027.40
138
US
116,374
13,729.02
47,382.95
139
Germany
44,976
18,402.19
35,903.45
140
UK
117,846
44,459.87
21,250.49
141
Japan
61,369
7,501.50
34,685.25
142
Italy
169,679
19,877.77
26,106.55
143
Greece
148,706
85,229.13
36,020.24
144
US
17,773
7,299.84
36,370.60
145
Germany
130,131
17,764.61
25,151.56
146
UK
106,300
12,619.21
18,366.66
147
Japan
91,388
97,082.70
34,397.20
148
Italy
48,635
30,498.82
18,154.58
149
Greece
128,161
64,831.20
5,162.92
150
US
72,396
32,244.47
47,642.86
151
Germany
81,283
80,381.95
1,854.23
152
UK
67,692
24,706.62
17,901.36
153
Japan
68,607
9,565.64
579.71
154
Italy
195,113
84,809.30
12,379.87
155
Greece
68,402
48,943.85
34,638.16
156
US
120,099
87,851.06
49,356.65
157
Germany
75,312
63,442.84
49,964.94
158
UK
3,411
38,241.83
3,576.05
159
Japan
190,950
9,503.70
35,550.75
160
Italy
155,216
47,885.31
33,298.55
161
Greece
54,184
13,671.37
5,015.48
162
US
31,961
17,569.60
10,499.60
163
Germany
164,406
71,542.46
21,562.30
164
UK
111,469
95,194.04
38,056.01
165
Japan
168,643
24,618.50
40,228.64
166
Italy
93,316
49,522.90
5,326.28
167
Greece
72,645
64,923.65
22,518.14
168
US
187,922
24,348.79
28,018.03
169
Germany
40,666
95,057.51
43,812.78
170
UK
111,386
15,846.02
26,050.75
171
Japan
54,604
15,315.95
33,866.45
172
Italy
150,235
55,944.27
3,405.01
173
Greece
117,569
40,068.68
15,071.64
174
US
51,205
32,287.77
43,832.80
175
Germany
73,811
24,849.33
18,400.30
176
UK
62,474
62,397.81
14,960.01
177
Japan
67,711
63,944.74
15,903.85
178
Italy
76,214
21,511.97
17,810.06
179
Greece
15,651
33,386.48
10,039.77
180
US
48,814
9,987.50
26,336.27
181
Germany
33,284
57,987.20
42,475.34
182
UK
161,068
67,454.99
7,639.17
183
Japan
140,075
86,934.95
24,342.08
184
Italy
10,098
46,534.19
31,243.00
185
Greece
51,119
47,149.40
37,987.26
186
US
70,121
61,478.01
49,113.68
187
Germany
103,713
41,993.54
23,357.25
188
UK
181,692
51,227.48
43,194.70
189
Japan
115,785
92,201.93
18,051.52
190
Italy
191,928
84,768.69
35,235.19
191
Greece
57,538
50,058.61
24,194.63
192
US
73,731
66,316.99
47,819.67
193
Germany
172,140
88,307.40
24,329.50
194
UK
18,446
88,943.19
29,554.90
195
Japan
19,088
3,911.02
24,933.87
196
Italy
157,910
15,630.18
4,179.22
197
Greece
85,914
52,411.78
6,164.09
198
US
18,602
73,568.33
18,706.18
199
Germany
81,351
67,051.69
7,656.40
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
// This file locates: "Scripts/Lesson/C1FlexGrid/Index.js".
c1.documentReady(function () {
    // create some random data
    var countries = 'US,Germany,UK,Japan,Italy,Greece'.split(','),
      data = [];
    for (var i = 0; i < 200; i++) {
        data.push({
            id: i,
            country: countries[i % countries.length],
            active: i % 5 != 0,
            downloads: Math.round(Math.random() * 200000),
            sales: Math.random() * 100000,
            expenses: Math.random() * 50000
        });
    }
 
    // default grid
    var gridDefault = wijmo.Control.getControl('#gridDefault');
    gridDefault.itemsSource = data;
 
    // customize columns
    var gridCols = wijmo.Control.getControl('#gridCols');
    gridCols.initialize({
        autoGenerateColumns: false,
        itemsSource: data,
        columns: [
            { header: 'Country', binding: 'country', width: '*' },
            { header: 'Downloads (k)', binding: 'downloads', format: 'n1,' },
            { header: 'Sales (k)', binding: 'sales', format: 'n1,' },
            { header: 'Expenses (k)', binding: 'expenses', format: 'c1,' },
        ]
    });
 
    // customize properties
    var gridProps = wijmo.Control.getControl('#gridProps');
    gridProps.itemsSource = data;
 
    var selectionMode = wijmo.Control.getControl('#selectionMode');
    selectionMode.selectedIndexChanged.addHandler(function () {
        gridProps.selectionMode = selectionMode.text
    });
    var allowSorting = wijmo.Control.getControl('#allowSorting');
    allowSorting.selectedIndexChanged.addHandler(function () {
        gridProps.allowSorting = allowSorting.text == 'True';
    });
    var allowDragging = wijmo.Control.getControl('#allowDragging');
    allowDragging.selectedIndexChanged.addHandler(function () {
        gridProps.allowDragging = allowDragging.text;
    });
    var isReadOnly = wijmo.Control.getControl('#isReadOnly');
    isReadOnly.selectedIndexChanged.addHandler(function () {
        gridProps.isReadOnly = isReadOnly.text == 'True';
    });
    var headersVisibility = wijmo.Control.getControl('#headersVisibility');
    headersVisibility.selectedIndexChanged.addHandler(function () {
        gridProps.headersVisibility = headersVisibility.text;
    });
});
1
2
3
4
5
6
7
8
9
10
11
// This file locates: "Content/css/Lesson/C1FlexGrid/Index.css".
.wj-flexgrid {
  max-height: 250px;
  margin-bottom: 12px;
}
.header {
  display: inline-block;
  width: 150px;
  text-align: right;
  font-weight: normal;
}
1
2
3
4
5
6
7
8
9
10
11
12
13
using System.Web.Mvc;
 
namespace LearnMvcClient.Controllers
{
    public partial class C1FlexGridController : Controller
    {
        // GET: Index
        public ActionResult Index()
        {
            return View();
        }
    }
}
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
<h1>
    @Html.Raw(Resources.C1FlexGrid.Index_Title)
</h1>
<p>
    @Html.Raw(Resources.C1FlexGrid.Index_Text1)
</p>
<p>
    @Html.Raw(Resources.C1FlexGrid.Index_Text2)
</p>
@Html.C1().FlexGrid().Id("gridDefault")
 
<p>
    @Html.Raw(Resources.C1FlexGrid.Index_Text3)
</p>
@Html.C1().FlexGrid().Id("gridCols")
 
<p>
    @Html.Raw(Resources.C1FlexGrid.Index_Text4)
</p>
@Html.C1().FlexGrid().Id("gridProps")
<label>
    <div class="header">@Html.Raw(Resources.C1FlexGrid.Index_Text5)</div>
    @(Html.C1().ComboBox().Id("selectionMode")
        .Bind(new[] { "None", "Cell", "CellRange", "Row", "RowRange", "ListBox" })
        .Text("CellRange")
    )
</label>
<label>
    <div class="header">@Html.Raw(Resources.C1FlexGrid.Index_Text6)</div>
    @(Html.C1().ComboBox().Id("allowSorting")
        .Bind(new[] { "True", "False" })
        .Text("True")
    )
</label>
<label>
    <div class="header">@Html.Raw(Resources.C1FlexGrid.Index_Text7)</div>
    @(Html.C1().ComboBox().Id("allowDragging")
        .Bind(new[] { "None", "Columns", "Rows", "Both" })
        .Text("Solumns")
    )
</label>
<label>
    <div class="header">@Html.Raw(Resources.C1FlexGrid.Index_Text8)</div>
    @(Html.C1().ComboBox().Id("isReadOnly")
        .Bind(new[] { "True", "False" })
        .Text("False")
    )
</label>
<label>
    <div class="header">@Html.Raw(Resources.C1FlexGrid.Index_Text9)</div>
    @(Html.C1().ComboBox().Id("headersVisibility")
        .Bind(new[] { "None", "Column", "Row", "All" })
        .Text("All")
    )
</label>