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
60,943
64,129.06
4,348.00
1
Germany
25,157
6,372.57
18,332.35
2
UK
193,203
78,187.67
29,914.59
3
Japan
173,986
68,494.96
47,199.17
4
Italy
172,008
85,599.03
44,107.63
5
Greece
35,655
71,498.58
27,195.25
6
US
19,398
39,067.72
40,747.52
7
Germany
135,551
14,330.28
13,779.91
8
UK
11,602
16,513.22
5,245.75
9
Japan
162,967
30,970.32
7,472.29
10
Italy
7,104
37,637.17
8,902.57
11
Greece
81,015
4,853.48
47,624.08
12
US
141,687
88,027.75
40,077.17
13
Germany
195,019
68,083.38
49,918.35
14
UK
164,282
29,892.69
25,140.02
15
Japan
120,224
98,459.54
23,975.36
16
Italy
180,822
35,942.91
23,721.18
17
Greece
16,298
73,648.52
23,402.31
18
US
170,367
8,014.77
4,838.76
19
Germany
100,187
3,205.79
12,701.41
20
UK
166,488
10,616.45
24,566.35
21
Japan
194,668
9,821.77
900.43
22
Italy
103,776
30,052.84
40,124.71
23
Greece
91,144
99,937.66
44,659.64
24
US
184,007
70,891.11
33,304.31
25
Germany
103,461
50,255.59
36,171.35
26
UK
196,873
849.36
30,090.41
27
Japan
195,956
85,775.22
45,766.54
28
Italy
13,914
61,138.42
48,875.50
29
Greece
52,534
33,392.87
18,106.08
30
US
189,638
8,664.58
38,422.76
31
Germany
164,118
29,620.91
43,640.35
32
UK
43,280
16,126.46
18,634.58
33
Japan
106,642
85,740.97
210.01
34
Italy
24,144
54,167.54
965.87
35
Greece
79,996
53,900.77
8,759.33
36
US
108,596
90,758.01
11,861.22
37
Germany
126,690
56,036.77
29,044.26
38
UK
145,922
14,635.46
45,862.23
39
Japan
189,766
20,327.94
21,914.73
40
Italy
73,614
91,204.63
9,316.51
41
Greece
3,399
76,612.15
34,590.11
42
US
2,487
68,078.51
15,067.55
43
Germany
24,363
41,769.28
14,509.15
44
UK
177,258
55,528.58
35,822.20
45
Japan
103,397
92,013.06
12,201.91
46
Italy
185,780
39,459.25
44,221.75
47
Greece
164,412
32,794.10
43,854.46
48
US
133,093
61,491.23
29,035.65
49
Germany
110,927
24,130.54
31,969.01
50
UK
29,163
60,697.89
3,709.80
51
Japan
165,381
35,482.37
11,083.48
52
Italy
97,676
8,123.96
2,374.55
53
Greece
48,304
64,235.62
42,212.92
54
US
84,866
83,504.06
16,406.79
55
Germany
23,290
66,870.09
34,542.89
56
UK
135,126
99,911.70
39,061.50
57
Japan
108,756
42,481.44
34,156.90
58
Italy
12,461
34,322.02
26,918.64
59
Greece
13,328
57,759.85
44,001.24
60
US
2,119
80,210.95
2,482.35
61
Germany
54,072
30,925.86
7,224.61
62
UK
153,589
21.02
26,886.43
63
Japan
130,906
57,418.32
40,297.32
64
Italy
119,268
40,373.59
4,267.05
65
Greece
56,951
1,669.97
36,955.96
66
US
61,028
97,685.54
1,376.13
67
Germany
164,282
99,383.37
45,034.63
68
UK
142,335
98,830.92
24,618.57
69
Japan
10,857
70,241.00
19,454.03
70
Italy
175,983
81,433.00
49,874.73
71
Greece
70,115
49,290.92
16,597.01
72
US
61,545
21,944.92
25,839.59
73
Germany
138,148
65,358.34
29,252.91
74
UK
83,181
41,095.24
27,082.29
75
Japan
139,940
12,235.44
32,477.44
76
Italy
178,924
87,741.74
661.70
77
Greece
78,146
51,836.55
9,636.06
78
US
53,532
93,856.16
2,739.96
79
Germany
188,891
95,870.88
26,404.32
80
UK
110,637
34,277.37
156.05
81
Japan
154,681
23,763.18
36,868.91
82
Italy
70,824
59,851.70
18,527.74
83
Greece
101,406
82,805.82
26,031.70
84
US
188,964
1,866.47
9,193.92
85
Germany
166,220
11,388.61
27,306.83
86
UK
32,180
50,334.49
8,220.54
87
Japan
76,082
96,082.05
10,528.79
88
Italy
116,969
50,936.38
28,348.25
89
Greece
158,437
11,134.63
4,106.96
90
US
1,914
73,600.47
14,650.06
91
Germany
135,654
355.30
18,811.25
92
UK
96,405
93,131.86
33,746.49
93
Japan
90,337
74,460.17
19,490.80
94
Italy
88,363
693.92
10,849.39
95
Greece
164,414
12,640.97
41,412.67
96
US
38,890
61,969.52
46,150.50
97
Germany
135,879
1,049.70
39,655.78
98
UK
190,212
16,823.75
33,996.25
99
Japan
80,270
75,320.23
13,788.04
100
Italy
63,535
55,514.45
37,049.33
101
Greece
160,161
87,554.83
27,835.09
102
US
116,772
32,060.13
33,549.41
103
Germany
20,729
13,997.50
9,554.51
104
UK
6,410
93,092.94
19,709.40
105
Japan
194,248
79,919.71
20,318.78
106
Italy
14,657
76,438.89
45,032.59
107
Greece
139,884
55,938.56
37,813.39
108
US
24,386
17,950.90
11,074.87
109
Germany
20,836
10,634.38
26,392.89
110
UK
21,983
35,172.42
9,826.76
111
Japan
41,875
52,779.80
4,146.47
112
Italy
95,593
83,981.21
42,157.06
113
Greece
98,893
73,280.98
43,497.42
114
US
27,953
57,657.62
13,845.74
115
Germany
31,507
39,295.57
42,160.94
116
UK
60,646
55,725.75
8,543.99
117
Japan
94,164
57,866.37
2,493.01
118
Italy
196,390
12,081.56
12,348.10
119
Greece
176,630
73,475.93
25,860.15
120
US
154,271
31,895.69
1,146.86
121
Germany
64,867
66,278.84
48,967.98
122
UK
69,302
73,490.36
40,771.86
123
Japan
20,459
53,000.12
33,745.34
124
Italy
147,285
99,291.74
34,465.16
125
Greece
61,832
82,984.94
34,595.07
126
US
1,208
16,125.10
2,286.67
127
Germany
23,464
87,963.24
39,780.87
128
UK
99,285
87,576.61
13,458.19
129
Japan
46,120
84,580.02
37,926.68
130
Italy
154,979
76,830.59
18,607.51
131
Greece
184,873
94,999.97
40,873.35
132
US
123,925
63,477.23
39,293.71
133
Germany
65,848
17,812.14
5,974.05
134
UK
114,722
73,912.44
49,577.90
135
Japan
29,363
21,308.81
18,840.95
136
Italy
118,227
26,683.85
2,302.62
137
Greece
158,251
84,032.02
11,780.64
138
US
151,796
97,205.52
15,134.68
139
Germany
100,097
24,095.80
40,129.18
140
UK
59,882
40,081.40
20,737.22
141
Japan
145,944
59,854.26
29,138.32
142
Italy
187,299
26,685.05
37,878.46
143
Greece
178,072
22,394.47
44,757.12
144
US
104,174
4,393.74
37,077.85
145
Germany
65,841
40,616.91
19,618.16
146
UK
131,611
2,910.03
6,429.97
147
Japan
89,694
19,923.29
19,662.10
148
Italy
6,551
60,251.53
35,133.38
149
Greece
179,002
82,067.46
36,519.13
150
US
14,266
94,266.37
5,521.57
151
Germany
7,346
73,305.66
36,977.76
152
UK
165,524
26,060.95
25,509.07
153
Japan
38,811
93,945.02
17,984.26
154
Italy
175,582
72,436.91
23,411.92
155
Greece
110,673
481.58
14,613.28
156
US
185,381
66,148.23
7,343.22
157
Germany
10,150
52,344.72
48,831.31
158
UK
182,677
84,281.82
15,168.34
159
Japan
199,195
94,608.79
28,706.57
160
Italy
37,264
18,935.20
39,964.28
161
Greece
55,158
22,789.40
21,399.00
162
US
112,012
32,817.43
26,270.90
163
Germany
156,799
67,276.76
40,879.20
164
UK
173,515
21,021.88
48,871.17
165
Japan
149,840
33,923.50
26,742.90
166
Italy
121,521
64,934.31
40,924.83
167
Greece
167,713
83,081.28
9,573.25
168
US
158,435
64,329.37
42,905.36
169
Germany
85,309
30,627.70
2,059.52
170
UK
34,159
93,457.79
347.70
171
Japan
178,338
3,629.02
24,735.25
172
Italy
177,930
31,382.32
13,700.29
173
Greece
126,526
62,166.76
1,368.88
174
US
40,172
83,522.35
23,737.15
175
Germany
26,798
25,935.35
18,991.46
176
UK
178,969
41,271.90
2,527.85
177
Japan
55,119
21,217.60
19,899.18
178
Italy
116,277
98,121.75
20,031.46
179
Greece
19,837
50,841.56
23,712.04
180
US
129,880
36,139.66
40,914.86
181
Germany
70,855
78,187.66
1,675.53
182
UK
94,900
86,059.09
7,873.63
183
Japan
98,767
80,318.02
47,412.84
184
Italy
26,851
14,932.49
29,600.77
185
Greece
194,243
70,608.11
48,906.47
186
US
130,678
85,790.90
44,811.22
187
Germany
66,739
44,122.65
36,796.23
188
UK
133,726
82,252.23
47,294.61
189
Japan
73,694
46,833.25
23,723.84
190
Italy
58,987
23,297.42
18,190.58
191
Greece
96,482
84,052.65
36,243.74
192
US
136,404
41,955.70
29,726.84
193
Germany
178,537
56,842.82
35,767.60
194
UK
114,489
67,060.32
8,708.47
195
Japan
153,295
8,766.34
20,235.29
196
Italy
144,402
37,206.81
8,045.76
197
Greece
37,478
66,917.99
29,835.73
198
US
154,824
89,568.99
39,021.74
199
Germany
110,833
75,010.63
27,067.52

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
60.9
64.1
$4.3
Germany
25.2
6.4
$18.3
UK
193.2
78.2
$29.9
Japan
174.0
68.5
$47.2
Italy
172.0
85.6
$44.1
Greece
35.7
71.5
$27.2
US
19.4
39.1
$40.7
Germany
135.6
14.3
$13.8
UK
11.6
16.5
$5.2
Japan
163.0
31.0
$7.5
Italy
7.1
37.6
$8.9
Greece
81.0
4.9
$47.6
US
141.7
88.0
$40.1
Germany
195.0
68.1
$49.9
UK
164.3
29.9
$25.1
Japan
120.2
98.5
$24.0
Italy
180.8
35.9
$23.7
Greece
16.3
73.6
$23.4
US
170.4
8.0
$4.8
Germany
100.2
3.2
$12.7
UK
166.5
10.6
$24.6
Japan
194.7
9.8
$0.9
Italy
103.8
30.1
$40.1
Greece
91.1
99.9
$44.7
US
184.0
70.9
$33.3
Germany
103.5
50.3
$36.2
UK
196.9
0.8
$30.1
Japan
196.0
85.8
$45.8
Italy
13.9
61.1
$48.9
Greece
52.5
33.4
$18.1
US
189.6
8.7
$38.4
Germany
164.1
29.6
$43.6
UK
43.3
16.1
$18.6
Japan
106.6
85.7
$0.2
Italy
24.1
54.2
$1.0
Greece
80.0
53.9
$8.8
US
108.6
90.8
$11.9
Germany
126.7
56.0
$29.0
UK
145.9
14.6
$45.9
Japan
189.8
20.3
$21.9
Italy
73.6
91.2
$9.3
Greece
3.4
76.6
$34.6
US
2.5
68.1
$15.1
Germany
24.4
41.8
$14.5
UK
177.3
55.5
$35.8
Japan
103.4
92.0
$12.2
Italy
185.8
39.5
$44.2
Greece
164.4
32.8
$43.9
US
133.1
61.5
$29.0
Germany
110.9
24.1
$32.0
UK
29.2
60.7
$3.7
Japan
165.4
35.5
$11.1
Italy
97.7
8.1
$2.4
Greece
48.3
64.2
$42.2
US
84.9
83.5
$16.4
Germany
23.3
66.9
$34.5
UK
135.1
99.9
$39.1
Japan
108.8
42.5
$34.2
Italy
12.5
34.3
$26.9
Greece
13.3
57.8
$44.0
US
2.1
80.2
$2.5
Germany
54.1
30.9
$7.2
UK
153.6
0.0
$26.9
Japan
130.9
57.4
$40.3
Italy
119.3
40.4
$4.3
Greece
57.0
1.7
$37.0
US
61.0
97.7
$1.4
Germany
164.3
99.4
$45.0
UK
142.3
98.8
$24.6
Japan
10.9
70.2
$19.5
Italy
176.0
81.4
$49.9
Greece
70.1
49.3
$16.6
US
61.5
21.9
$25.8
Germany
138.1
65.4
$29.3
UK
83.2
41.1
$27.1
Japan
139.9
12.2
$32.5
Italy
178.9
87.7
$0.7
Greece
78.1
51.8
$9.6
US
53.5
93.9
$2.7
Germany
188.9
95.9
$26.4
UK
110.6
34.3
$0.2
Japan
154.7
23.8
$36.9
Italy
70.8
59.9
$18.5
Greece
101.4
82.8
$26.0
US
189.0
1.9
$9.2
Germany
166.2
11.4
$27.3
UK
32.2
50.3
$8.2
Japan
76.1
96.1
$10.5
Italy
117.0
50.9
$28.3
Greece
158.4
11.1
$4.1
US
1.9
73.6
$14.7
Germany
135.7
0.4
$18.8
UK
96.4
93.1
$33.7
Japan
90.3
74.5
$19.5
Italy
88.4
0.7
$10.8
Greece
164.4
12.6
$41.4
US
38.9
62.0
$46.2
Germany
135.9
1.0
$39.7
UK
190.2
16.8
$34.0
Japan
80.3
75.3
$13.8
Italy
63.5
55.5
$37.0
Greece
160.2
87.6
$27.8
US
116.8
32.1
$33.5
Germany
20.7
14.0
$9.6
UK
6.4
93.1
$19.7
Japan
194.2
79.9
$20.3
Italy
14.7
76.4
$45.0
Greece
139.9
55.9
$37.8
US
24.4
18.0
$11.1
Germany
20.8
10.6
$26.4
UK
22.0
35.2
$9.8
Japan
41.9
52.8
$4.1
Italy
95.6
84.0
$42.2
Greece
98.9
73.3
$43.5
US
28.0
57.7
$13.8
Germany
31.5
39.3
$42.2
UK
60.6
55.7
$8.5
Japan
94.2
57.9
$2.5
Italy
196.4
12.1
$12.3
Greece
176.6
73.5
$25.9
US
154.3
31.9
$1.1
Germany
64.9
66.3
$49.0
UK
69.3
73.5
$40.8
Japan
20.5
53.0
$33.7
Italy
147.3
99.3
$34.5
Greece
61.8
83.0
$34.6
US
1.2
16.1
$2.3
Germany
23.5
88.0
$39.8
UK
99.3
87.6
$13.5
Japan
46.1
84.6
$37.9
Italy
155.0
76.8
$18.6
Greece
184.9
95.0
$40.9
US
123.9
63.5
$39.3
Germany
65.8
17.8
$6.0
UK
114.7
73.9
$49.6
Japan
29.4
21.3
$18.8
Italy
118.2
26.7
$2.3
Greece
158.3
84.0
$11.8
US
151.8
97.2
$15.1
Germany
100.1
24.1
$40.1
UK
59.9
40.1
$20.7
Japan
145.9
59.9
$29.1
Italy
187.3
26.7
$37.9
Greece
178.1
22.4
$44.8
US
104.2
4.4
$37.1
Germany
65.8
40.6
$19.6
UK
131.6
2.9
$6.4
Japan
89.7
19.9
$19.7
Italy
6.6
60.3
$35.1
Greece
179.0
82.1
$36.5
US
14.3
94.3
$5.5
Germany
7.3
73.3
$37.0
UK
165.5
26.1
$25.5
Japan
38.8
93.9
$18.0
Italy
175.6
72.4
$23.4
Greece
110.7
0.5
$14.6
US
185.4
66.1
$7.3
Germany
10.2
52.3
$48.8
UK
182.7
84.3
$15.2
Japan
199.2
94.6
$28.7
Italy
37.3
18.9
$40.0
Greece
55.2
22.8
$21.4
US
112.0
32.8
$26.3
Germany
156.8
67.3
$40.9
UK
173.5
21.0
$48.9
Japan
149.8
33.9
$26.7
Italy
121.5
64.9
$40.9
Greece
167.7
83.1
$9.6
US
158.4
64.3
$42.9
Germany
85.3
30.6
$2.1
UK
34.2
93.5
$0.3
Japan
178.3
3.6
$24.7
Italy
177.9
31.4
$13.7
Greece
126.5
62.2
$1.4
US
40.2
83.5
$23.7
Germany
26.8
25.9
$19.0
UK
179.0
41.3
$2.5
Japan
55.1
21.2
$19.9
Italy
116.3
98.1
$20.0
Greece
19.8
50.8
$23.7
US
129.9
36.1
$40.9
Germany
70.9
78.2
$1.7
UK
94.9
86.1
$7.9
Japan
98.8
80.3
$47.4
Italy
26.9
14.9
$29.6
Greece
194.2
70.6
$48.9
US
130.7
85.8
$44.8
Germany
66.7
44.1
$36.8
UK
133.7
82.3
$47.3
Japan
73.7
46.8
$23.7
Italy
59.0
23.3
$18.2
Greece
96.5
84.1
$36.2
US
136.4
42.0
$29.7
Germany
178.5
56.8
$35.8
UK
114.5
67.1
$8.7
Japan
153.3
8.8
$20.2
Italy
144.4
37.2
$8.0
Greece
37.5
66.9
$29.8
US
154.8
89.6
$39.0
Germany
110.8
75.0
$27.1

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
60,943
64,129.06
4,348.00
1
Germany
25,157
6,372.57
18,332.35
2
UK
193,203
78,187.67
29,914.59
3
Japan
173,986
68,494.96
47,199.17
4
Italy
172,008
85,599.03
44,107.63
5
Greece
35,655
71,498.58
27,195.25
6
US
19,398
39,067.72
40,747.52
7
Germany
135,551
14,330.28
13,779.91
8
UK
11,602
16,513.22
5,245.75
9
Japan
162,967
30,970.32
7,472.29
10
Italy
7,104
37,637.17
8,902.57
11
Greece
81,015
4,853.48
47,624.08
12
US
141,687
88,027.75
40,077.17
13
Germany
195,019
68,083.38
49,918.35
14
UK
164,282
29,892.69
25,140.02
15
Japan
120,224
98,459.54
23,975.36
16
Italy
180,822
35,942.91
23,721.18
17
Greece
16,298
73,648.52
23,402.31
18
US
170,367
8,014.77
4,838.76
19
Germany
100,187
3,205.79
12,701.41
20
UK
166,488
10,616.45
24,566.35
21
Japan
194,668
9,821.77
900.43
22
Italy
103,776
30,052.84
40,124.71
23
Greece
91,144
99,937.66
44,659.64
24
US
184,007
70,891.11
33,304.31
25
Germany
103,461
50,255.59
36,171.35
26
UK
196,873
849.36
30,090.41
27
Japan
195,956
85,775.22
45,766.54
28
Italy
13,914
61,138.42
48,875.50
29
Greece
52,534
33,392.87
18,106.08
30
US
189,638
8,664.58
38,422.76
31
Germany
164,118
29,620.91
43,640.35
32
UK
43,280
16,126.46
18,634.58
33
Japan
106,642
85,740.97
210.01
34
Italy
24,144
54,167.54
965.87
35
Greece
79,996
53,900.77
8,759.33
36
US
108,596
90,758.01
11,861.22
37
Germany
126,690
56,036.77
29,044.26
38
UK
145,922
14,635.46
45,862.23
39
Japan
189,766
20,327.94
21,914.73
40
Italy
73,614
91,204.63
9,316.51
41
Greece
3,399
76,612.15
34,590.11
42
US
2,487
68,078.51
15,067.55
43
Germany
24,363
41,769.28
14,509.15
44
UK
177,258
55,528.58
35,822.20
45
Japan
103,397
92,013.06
12,201.91
46
Italy
185,780
39,459.25
44,221.75
47
Greece
164,412
32,794.10
43,854.46
48
US
133,093
61,491.23
29,035.65
49
Germany
110,927
24,130.54
31,969.01
50
UK
29,163
60,697.89
3,709.80
51
Japan
165,381
35,482.37
11,083.48
52
Italy
97,676
8,123.96
2,374.55
53
Greece
48,304
64,235.62
42,212.92
54
US
84,866
83,504.06
16,406.79
55
Germany
23,290
66,870.09
34,542.89
56
UK
135,126
99,911.70
39,061.50
57
Japan
108,756
42,481.44
34,156.90
58
Italy
12,461
34,322.02
26,918.64
59
Greece
13,328
57,759.85
44,001.24
60
US
2,119
80,210.95
2,482.35
61
Germany
54,072
30,925.86
7,224.61
62
UK
153,589
21.02
26,886.43
63
Japan
130,906
57,418.32
40,297.32
64
Italy
119,268
40,373.59
4,267.05
65
Greece
56,951
1,669.97
36,955.96
66
US
61,028
97,685.54
1,376.13
67
Germany
164,282
99,383.37
45,034.63
68
UK
142,335
98,830.92
24,618.57
69
Japan
10,857
70,241.00
19,454.03
70
Italy
175,983
81,433.00
49,874.73
71
Greece
70,115
49,290.92
16,597.01
72
US
61,545
21,944.92
25,839.59
73
Germany
138,148
65,358.34
29,252.91
74
UK
83,181
41,095.24
27,082.29
75
Japan
139,940
12,235.44
32,477.44
76
Italy
178,924
87,741.74
661.70
77
Greece
78,146
51,836.55
9,636.06
78
US
53,532
93,856.16
2,739.96
79
Germany
188,891
95,870.88
26,404.32
80
UK
110,637
34,277.37
156.05
81
Japan
154,681
23,763.18
36,868.91
82
Italy
70,824
59,851.70
18,527.74
83
Greece
101,406
82,805.82
26,031.70
84
US
188,964
1,866.47
9,193.92
85
Germany
166,220
11,388.61
27,306.83
86
UK
32,180
50,334.49
8,220.54
87
Japan
76,082
96,082.05
10,528.79
88
Italy
116,969
50,936.38
28,348.25
89
Greece
158,437
11,134.63
4,106.96
90
US
1,914
73,600.47
14,650.06
91
Germany
135,654
355.30
18,811.25
92
UK
96,405
93,131.86
33,746.49
93
Japan
90,337
74,460.17
19,490.80
94
Italy
88,363
693.92
10,849.39
95
Greece
164,414
12,640.97
41,412.67
96
US
38,890
61,969.52
46,150.50
97
Germany
135,879
1,049.70
39,655.78
98
UK
190,212
16,823.75
33,996.25
99
Japan
80,270
75,320.23
13,788.04
100
Italy
63,535
55,514.45
37,049.33
101
Greece
160,161
87,554.83
27,835.09
102
US
116,772
32,060.13
33,549.41
103
Germany
20,729
13,997.50
9,554.51
104
UK
6,410
93,092.94
19,709.40
105
Japan
194,248
79,919.71
20,318.78
106
Italy
14,657
76,438.89
45,032.59
107
Greece
139,884
55,938.56
37,813.39
108
US
24,386
17,950.90
11,074.87
109
Germany
20,836
10,634.38
26,392.89
110
UK
21,983
35,172.42
9,826.76
111
Japan
41,875
52,779.80
4,146.47
112
Italy
95,593
83,981.21
42,157.06
113
Greece
98,893
73,280.98
43,497.42
114
US
27,953
57,657.62
13,845.74
115
Germany
31,507
39,295.57
42,160.94
116
UK
60,646
55,725.75
8,543.99
117
Japan
94,164
57,866.37
2,493.01
118
Italy
196,390
12,081.56
12,348.10
119
Greece
176,630
73,475.93
25,860.15
120
US
154,271
31,895.69
1,146.86
121
Germany
64,867
66,278.84
48,967.98
122
UK
69,302
73,490.36
40,771.86
123
Japan
20,459
53,000.12
33,745.34
124
Italy
147,285
99,291.74
34,465.16
125
Greece
61,832
82,984.94
34,595.07
126
US
1,208
16,125.10
2,286.67
127
Germany
23,464
87,963.24
39,780.87
128
UK
99,285
87,576.61
13,458.19
129
Japan
46,120
84,580.02
37,926.68
130
Italy
154,979
76,830.59
18,607.51
131
Greece
184,873
94,999.97
40,873.35
132
US
123,925
63,477.23
39,293.71
133
Germany
65,848
17,812.14
5,974.05
134
UK
114,722
73,912.44
49,577.90
135
Japan
29,363
21,308.81
18,840.95
136
Italy
118,227
26,683.85
2,302.62
137
Greece
158,251
84,032.02
11,780.64
138
US
151,796
97,205.52
15,134.68
139
Germany
100,097
24,095.80
40,129.18
140
UK
59,882
40,081.40
20,737.22
141
Japan
145,944
59,854.26
29,138.32
142
Italy
187,299
26,685.05
37,878.46
143
Greece
178,072
22,394.47
44,757.12
144
US
104,174
4,393.74
37,077.85
145
Germany
65,841
40,616.91
19,618.16
146
UK
131,611
2,910.03
6,429.97
147
Japan
89,694
19,923.29
19,662.10
148
Italy
6,551
60,251.53
35,133.38
149
Greece
179,002
82,067.46
36,519.13
150
US
14,266
94,266.37
5,521.57
151
Germany
7,346
73,305.66
36,977.76
152
UK
165,524
26,060.95
25,509.07
153
Japan
38,811
93,945.02
17,984.26
154
Italy
175,582
72,436.91
23,411.92
155
Greece
110,673
481.58
14,613.28
156
US
185,381
66,148.23
7,343.22
157
Germany
10,150
52,344.72
48,831.31
158
UK
182,677
84,281.82
15,168.34
159
Japan
199,195
94,608.79
28,706.57
160
Italy
37,264
18,935.20
39,964.28
161
Greece
55,158
22,789.40
21,399.00
162
US
112,012
32,817.43
26,270.90
163
Germany
156,799
67,276.76
40,879.20
164
UK
173,515
21,021.88
48,871.17
165
Japan
149,840
33,923.50
26,742.90
166
Italy
121,521
64,934.31
40,924.83
167
Greece
167,713
83,081.28
9,573.25
168
US
158,435
64,329.37
42,905.36
169
Germany
85,309
30,627.70
2,059.52
170
UK
34,159
93,457.79
347.70
171
Japan
178,338
3,629.02
24,735.25
172
Italy
177,930
31,382.32
13,700.29
173
Greece
126,526
62,166.76
1,368.88
174
US
40,172
83,522.35
23,737.15
175
Germany
26,798
25,935.35
18,991.46
176
UK
178,969
41,271.90
2,527.85
177
Japan
55,119
21,217.60
19,899.18
178
Italy
116,277
98,121.75
20,031.46
179
Greece
19,837
50,841.56
23,712.04
180
US
129,880
36,139.66
40,914.86
181
Germany
70,855
78,187.66
1,675.53
182
UK
94,900
86,059.09
7,873.63
183
Japan
98,767
80,318.02
47,412.84
184
Italy
26,851
14,932.49
29,600.77
185
Greece
194,243
70,608.11
48,906.47
186
US
130,678
85,790.90
44,811.22
187
Germany
66,739
44,122.65
36,796.23
188
UK
133,726
82,252.23
47,294.61
189
Japan
73,694
46,833.25
23,723.84
190
Italy
58,987
23,297.42
18,190.58
191
Greece
96,482
84,052.65
36,243.74
192
US
136,404
41,955.70
29,726.84
193
Germany
178,537
56,842.82
35,767.60
194
UK
114,489
67,060.32
8,708.47
195
Japan
153,295
8,766.34
20,235.29
196
Italy
144,402
37,206.81
8,045.76
197
Greece
37,478
66,917.99
29,835.73
198
US
154,824
89,568.99
39,021.74
199
Germany
110,833
75,010.63
27,067.52
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>