Multi-Pane Grid

Although FlexGrid does not allow you to freeze columns on the right of the grid, or rows along the bottom. But this example shows how you can implement something similar using two grids bound to the same data source.

Id
Country
Downloads
Sales
Expenses
Amount1
Amount2
Amount3
Amount4
Amount5
Amount6
Amount7
0
US
16,387
8,408.89
1,868.61
218.61
4,610.58
3,221.89
4,057.38
142.95
3,673.64
1,101.10
1
Germany
7,757
6,260.10
2,189.99
521.66
1,309.31
3,150.97
3,256.70
3,165.08
800.58
461.69
2
UK
3,833
9,492.98
718.93
1,451.84
313.48
4,808.81
3,663.28
169.37
1,161.46
3,871.79
3
Japan
9,454
9,230.92
3,628.44
757.30
4,842.60
3,180.44
20.29
3,018.91
1,844.24
21.12
4
Italy
7,525
8,288.42
1,259.55
721.80
4,680.01
628.41
3,128.21
2,274.68
4,974.08
208.95
5
Greece
5,138
8,141.26
3,650.75
3,157.44
3,063.31
3,404.29
2,479.63
3,085.03
514.21
2,128.93
6
Austria
19,523
3,485.46
820.42
2,625.57
2,152.74
2,887.74
3,317.46
324.50
4,742.71
878.91
7
Belgium
9,893
2,484.84
4,909.52
3,398.13
2,345.42
1,510.15
1,460.06
2,035.94
960.90
4,248.36
8
China
4,542
3,743.96
2,315.83
3,586.04
2,522.46
202.24
3,264.91
30.84
3,121.81
2,905.53
9
Korea
7,039
9,518.64
2,263.13
2,365.89
237.10
2,234.06
1,476.40
1,549.23
4,261.65
3,551.77
10
US
4,270
2,055.45
1,257.37
1,747.60
161.21
1,319.57
415.40
4,202.45
4,343.25
383.72
11
Germany
12,790
3,365.30
2,309.82
4,128.88
3,120.25
361.37
3,024.37
1,241.59
4,284.19
3,404.26
12
UK
4,552
979.41
4,706.70
2,776.03
2,426.84
1,551.32
3,750.00
4,276.61
1,367.29
2,739.32
13
Japan
9,809
7,249.69
3,834.38
3,336.66
2,275.41
3,554.63
3,170.70
4,960.24
4,809.51
3,844.28
14
Italy
18,433
1,340.29
4,766.39
1,548.56
1,491.49
12.22
432.71
715.05
3,237.34
2,980.69
15
Greece
12,957
926.92
3,049.33
796.22
1,838.70
2,039.40
477.59
3,117.28
2,682.46
3,626.93
16
Austria
18,682
8,716.57
627.53
1,362.48
2,245.45
4,949.26
2,187.79
208.92
4,342.14
1,215.17
17
Belgium
3,653
4,256.70
657.16
3,981.01
1,785.33
2,467.80
1,692.92
2,064.11
1,521.96
1,970.09
18
China
17,774
3,758.12
408.49
1,479.13
3,888.53
3,864.18
451.48
161.13
4,822.59
3,315.64
19
Korea
2,114
2,440.11
1,423.64
2,804.64
1,295.77
707.74
2,386.02
4,162.43
3,902.01
1,670.29
20
US
14,127
9,143.99
3,907.07
3,222.78
1,336.31
2,966.06
209.08
3,086.73
3,103.09
1,420.64
21
Germany
2,132
2,215.89
4,823.14
3,549.55
3,681.51
3,748.50
1,686.37
3,373.08
4,692.95
4,415.25
22
UK
8,828
700.29
165.95
1,530.57
2,367.87
277.92
3,639.49
1,221.65
1,743.87
179.39
23
Japan
1,735
3,563.72
3,278.18
3,473.94
3,245.74
4,295.28
4,449.35
1,568.61
1,206.37
3,235.22
24
Italy
14,275
4,683.29
4,598.72
1,108.86
2,591.42
2,816.55
2,371.62
2,732.50
4,112.74
4,358.56
25
Greece
16,905
6,488.15
2,513.95
4,094.71
1,841.72
2,365.65
4,611.07
3,061.29
1,865.61
151.13
26
Austria
10,839
5,574.35
666.10
4,055.69
2,373.51
2,935.49
2,062.11
4,344.21
2,426.85
3,445.21
27
Belgium
13,727
9,861.86
2,416.59
635.94
1,014.38
4,706.32
4,108.63
4,794.17
1,826.34
1,651.10
28
China
19,232
8,710.16
3,075.92
4,656.35
1,633.96
3,848.21
4,109.31
1,183.67
2,997.21
4,409.61
29
Korea
1,619
3,414.76
3,661.28
4,642.02
3,841.58
3,352.74
1,587.18
2,119.88
4,256.57
3,346.75
30
US
13,197
916.89
94.97
1,831.41
3,987.42
987.74
4,250.11
4,491.60
3,958.96
3,706.02
31
Germany
4,493
7,667.44
425.02
2,094.69
2,755.72
1,830.53
829.00
834.59
2,887.33
4,285.64
32
UK
6,371
4,456.62
1,639.14
4,116.12
2,950.88
2,645.24
2,073.83
367.55
534.06
454.36
33
Japan
8,282
5,056.32
4,740.80
522.49
2,687.79
4,716.32
2,007.86
3,197.16
3,350.25
3,612.23
34
Italy
6,373
9,623.78
1,240.41
2,580.98
1,833.96
2,142.40
4,007.63
1,874.54
735.29
4,526.51
35
Greece
13,845
9,657.64
2,740.95
1,725.70
2,970.47
2,440.86
3,262.56
3,610.26
607.09
4,836.32
36
Austria
17,813
9,411.54
2,603.94
2,854.92
2,819.62
4,816.09
115.75
2,120.62
2,148.28
2,784.47
37
Belgium
340
6,581.84
45.01
2,016.41
974.81
662.65
981.36
901.23
1,811.32
4,441.54
38
China
8,817
234.25
2,858.62
1,585.24
2,584.48
3,807.71
640.63
2,348.15
2,126.79
124.52
39
Korea
18,511
9,922.02
1,461.22
1,100.98
2,181.08
4,019.75
3,964.21
4,515.78
4,534.07
3,911.09
40
US
13,199
3,040.19
3,514.61
1,461.03
4,407.69
1,493.90
923.59
2,873.15
2,342.12
4,201.25
41
Germany
9,473
977.18
1,337.86
3,864.81
748.04
3,650.89
166.35
4,913.10
2,258.77
1,522.80
42
UK
10,903
9,455.54
2,560.40
2,055.93
1,455.84
2,515.29
1,442.88
3,120.55
1,658.32
508.54
43
Japan
14,310
2,087.60
4,327.05
1,916.35
2,391.63
660.70
219.73
1,202.83
4,783.23
1,075.83
44
Italy
4,530
5,384.78
284.14
1,777.20
37.75
2,539.48
2,000.66
2,250.21
386.54
1,337.32
45
Greece
11,043
1,852.65
251.96
3,431.08
4,760.14
3,276.95
890.57
3,178.66
870.35
3,523.80
46
Austria
14,018
5,695.32
2,174.89
3,104.96
4,983.76
1,365.26
2,422.85
2,658.18
4,477.34
3,444.48
47
Belgium
13,923
1,634.03
2,024.51
1,429.43
3,681.60
1,339.23
3,647.74
4,270.32
3,164.46
977.44
48
China
3,103
7,916.51
3,275.33
4,764.61
3,543.53
3,209.13
934.97
2,078.26
1,349.52
3,139.13
49
Korea
10,647
5,129.90
2,963.80
17.55
4,985.05
4,111.19
3,910.49
4,866.95
2,118.75
4,136.87
50
US
4,871
6,766.51
2,779.62
2,553.59
3,765.33
3,790.57
2,838.12
1,787.18
1,206.59
3,823.98
51
Germany
15,798
2,931.02
2,035.76
1,994.72
4,584.20
1,922.32
1,531.18
4,402.58
1,945.46
2,313.25
52
UK
2,840
3,568.93
110.97
4,512.44
4,185.07
2,752.58
4,798.70
4,415.05
4,608.78
4,959.02
53
Japan
16,262
5,178.68
3,773.94
653.40
4,668.34
4,535.92
3,767.96
190.59
3,060.26
4,511.28
54
Italy
11,458
9,557.51
1,923.04
1,405.33
4,382.34
3,803.51
1,382.37
773.05
143.22
3,875.93
55
Greece
12,340
8,532.21
3,890.44
1,978.17
1,594.38
345.49
736.59
2,061.89
707.70
968.73
56
Austria
18,077
7,560.80
4,121.68
2,580.45
4,796.79
322.82
1,982.45
2,405.41
1,927.58
2,236.22
57
Belgium
14,036
238.53
2,933.71
3,615.08
4,114.67
3,781.14
3,094.31
360.51
2,579.26
3,283.97
58
China
16,924
2,236.23
3,768.94
2,689.83
522.83
1,025.39
2,332.77
3,373.61
2,394.95
4,148.63
59
Korea
3,238
5,870.60
1,167.06
1,007.99
337.01
241.46
1,151.46
3,016.20
950.18
373.44
60
US
10,503
4,223.59
4,022.11
4,075.05
3,311.02
3,216.39
3,863.56
4,258.02
4,990.28
619.43
61
Germany
18,357
2,625.04
1,669.59
1,139.83
4,251.62
457.26
62.57
3,148.53
1,620.36
30.35
62
UK
10,873
3,022.63
3,623.69
4,928.24
477.29
4,978.20
796.97
3,882.57
1,702.32
4,799.19
63
Japan
49
7,063.00
1,410.75
2,557.67
2,675.96
2,978.96
4,121.01
3,150.86
1,326.69
2,173.13
64
Italy
4,737
4,297.28
4,259.92
3,991.92
560.50
4,267.95
376.72
1,691.95
1,781.61
3,536.18
65
Greece
9,847
2,708.50
3,725.17
2,885.16
3,468.72
4,533.73
1,724.61
2,843.18
387.04
3,789.82
66
Austria
15,516
9,649.44
2,145.38
3,278.54
1,891.97
4,269.57
485.53
585.23
350.90
2,361.80
67
Belgium
18,484
4,744.25
4,870.78
1,541.69
1,426.18
1,576.12
1,049.13
3,919.83
1,880.29
4,978.58
68
China
4,895
904.93
604.95
2,237.38
3,741.38
3,518.62
2,719.23
3,872.99
1,746.94
1,412.42
69
Korea
16,165
6,341.63
25.75
3,404.17
219.21
2,741.80
2,240.75
3,733.65
2,640.21
3,046.49
70
US
13,606
2,831.22
2,461.69
3,981.91
4,995.34
3,720.69
4,089.08
229.06
1,754.38
706.70
71
Germany
3,771
9,813.98
2,195.51
1,795.76
365.95
2,705.92
4,742.78
3,891.87
1,491.61
4,465.44
72
UK
9,447
3,314.29
4,997.52
3,842.90
331.06
4,353.56
4,468.12
659.63
3,008.23
1,076.31
73
Japan
18,818
8,345.56
1,934.21
1,029.04
3,934.82
790.24
773.01
2,642.45
3,295.32
1,269.05
74
Italy
7,336
3,088.03
1,350.73
4,493.41
1,295.41
102.48
2,444.37
736.86
3,184.66
779.48
75
Greece
19,754
6,877.14
4,334.86
4,203.29
1,574.54
2,065.88
83.59
1,843.76
3,926.02
4,210.17
76
Austria
17,345
2,619.73
2,235.97
3,733.08
1,949.58
2,750.97
900.43
3,447.29
1,679.52
1,715.66
77
Belgium
3,328
1,178.25
1,336.42
4,906.42
659.80
4,385.60
16.86
4,889.49
3,269.92
216.77
78
China
6,911
2,190.56
1,585.99
4,111.69
3,415.61
4,392.21
1,855.81
531.72
3,466.38
3,159.23
79
Korea
6,856
2,477.14
3,508.66
718.77
1,756.54
4,687.48
1,685.28
1,786.44
4,373.90
715.90
80
US
4,352
5,015.12
1,737.30
3,547.11
716.04
2,834.15
3,458.03
2,150.46
1,617.91
4,397.55
81
Germany
4,762
6,825.40
1,215.83
1,573.54
3,785.19
330.82
2,277.41
2,414.46
2,883.89
2,384.30
82
UK
10,978
2,999.06
4,546.91
998.87
67.93
411.98
2,893.08
3,974.59
3,864.11
3,407.70
83
Japan
17,401
9,341.18
2,496.04
3,516.55
3,682.47
502.09
839.71
696.14
3,291.80
1,533.17
84
Italy
11,330
1,534.06
4,136.97
3,864.99
444.70
550.23
664.10
4,873.01
649.82
4,999.20
85
Greece
3,900
287.89
3,899.33
1,519.30
2,045.53
3,983.30
4,480.72
652.11
1,300.45
1,601.87
86
Austria
15,924
3,727.95
4,891.24
4,517.26
3,780.98
2,607.69
914.25
3,080.38
4,061.17
658.62
87
Belgium
7,539
2,159.51
1,052.79
626.15
3,417.37
4,460.89
237.53
4,058.76
4,299.08
1,191.16
88
China
5,319
7,358.05
4,474.60
155.90
128.66
2,346.34
4,972.27
3,903.47
1,622.51
655.50
89
Korea
6,862
2,323.22
352.72
4,441.08
368.34
3,085.30
578.58
3,379.06
421.10
3,248.32
90
US
3,281
486.42
898.20
3,345.92
3,965.39
1,817.04
2,031.70
4,266.68
3,929.01
2,143.33
91
Germany
14,526
7,801.70
412.15
4,784.61
2,797.65
4,304.75
2,323.69
585.89
4,568.43
238.82
92
UK
9,826
375.75
3,929.29
2,056.32
1,375.73
1,354.68
2,124.45
436.75
2,225.39
631.90
93
Japan
14,908
902.97
3,577.97
1,651.69
408.02
631.43
3,229.47
4,030.21
1,350.69
1,805.86
94
Italy
10,813
5,649.56
340.96
1,615.24
2,806.40
2,382.56
1,635.90
4,555.88
1,574.91
3,643.42
95
Greece
6,470
9,943.10
940.05
3,925.44
4,619.17
2,976.45
2,900.69
3,761.69
835.11
2,350.09
96
Austria
5,644
8,864.89
1,209.29
4,491.66
3,694.61
2,143.47
132.64
466.63
3,451.37
2,843.52
97
Belgium
12,555
7,753.94
1,614.55
682.06
1,690.68
4,498.95
3,081.08
1,196.21
3,471.68
1,919.37
98
China
13,676
6,828.96
2,742.67
1,768.41
727.42
130.55
3,113.81
886.56
351.68
1,535.64
99
Korea
19,586
9,132.03
674.48
3,848.99
4,274.36
107.58
1,695.94
1,924.52
1,033.35
266.82
100
US
1,260
7,354.96
2,137.95
3,588.47
2,280.38
3,106.61
3,804.48
4,942.35
4,148.52
3,343.37
101
Germany
19,370
1,583.60
1,250.41
3,006.88
3,219.30
3,538.03
4,385.92
41.98
2,067.35
2,694.13
102
UK
2,664
851.97
3,560.87
1,955.94
3,921.93
3,758.73
934.65
2,259.88
4,314.64
3,651.35
103
Japan
4,593
2,568.76
2,277.93
2,221.97
2,410.59
3,834.83
421.89
4,067.42
3,775.79
1,933.69
104
Italy
18,942
3,599.45
711.02
2,915.20
3,305.57
3,503.81
4,489.05
4,296.81
1,485.41
662.34
105
Greece
9,211
8,807.34
208.84
4,544.84
1,504.50
1,585.07
1,954.47
4,458.23
2,633.41
2,921.59
106
Austria
16,341
4,396.13
4,550.08
4,428.84
4,101.24
1,065.53
1,789.70
1,640.28
4,241.58
4,366.73
107
Belgium
16,661
5,381.06
4,806.79
4,277.88
144.49
3,988.99
3,542.27
1,716.55
785.55
3,533.34
108
China
19,777
3,740.09
2,380.72
4,665.54
2,877.88
862.10
317.60
1,629.46
4,456.73
3,793.43
109
Korea
1,111
5,421.74
2,900.61
2,716.94
4,371.91
3,900.46
2,514.28
1,055.89
1,020.68
1,184.73
110
US
17,173
9,305.00
4,852.86
1,217.54
3,337.45
771.73
2,466.46
1,066.08
244.08
3,172.42
111
Germany
9,973
712.78
3,870.92
576.33
4,636.32
289.31
572.78
1,749.90
2,827.23
3,293.10
112
UK
5,389
3,551.11
2,448.79
3,291.47
3,103.81
3,602.65
699.19
2,745.59
3,295.56
2,788.18
113
Japan
2,418
8,397.25
2,610.30
2,731.55
628.86
4,414.36
66.62
1,277.59
904.31
1,262.74
114
Italy
4,837
4,047.68
3,440.35
1,797.06
4,156.23
2,740.51
3,213.97
3,905.50
518.06
1,925.58
115
Greece
861
7,697.71
2,509.89
1,717.04
4,532.05
4,807.93
4,970.82
1,081.24
2,757.13
1,168.46
116
Austria
16,945
8,701.96
1,187.36
1,143.92
2,932.98
546.81
1,017.92
3,494.96
905.60
2,803.30
117
Belgium
5,818
487.22
2,463.62
117.35
3,886.46
1,473.48
2,172.90
1,792.84
4,676.80
404.37
118
China
10,002
1,023.26
3,621.03
4,793.48
2,521.66
1,367.68
2,645.53
3,273.63
4,581.82
3,827.15
119
Korea
19,298
491.91
3,637.04
4,916.62
2,745.30
1,976.21
4,086.36
3,830.75
4,657.17
1,096.80
120
US
233
5,820.33
4,559.66
959.34
127.31
675.79
4,407.76
1,219.44
4,746.49
1,243.90
121
Germany
549
8,906.42
3,637.26
1,077.57
3,261.65
4,585.45
573.01
2,011.81
3,769.20
135.00
122
UK
9,200
8,362.27
4,710.93
143.21
616.94
1,691.07
4,749.46
717.70
4,835.59
2,629.89
123
Japan
13,281
501.53
2,880.51
3,993.91
1,642.23
3,705.91
1,485.83
1,583.38
1,580.78
3,781.35
124
Italy
9,566
5,119.38
3,374.06
696.97
238.99
7.13
3,277.72
402.20
3,693.17
4,734.03
125
Greece
8,563
8,844.16
4,366.19
1,725.35
1,707.07
1,907.53
2,204.22
4,578.60
3,169.83
1,243.78
126
Austria
16,561
9,085.28
2,740.67
2,202.26
1,635.11
1,721.75
4,325.41
4,696.84
342.35
4,214.47
127
Belgium
8,379
1,018.08
767.29
3,125.62
716.99
305.66
547.72
1,598.48
4,405.69
3,487.50
128
China
4,054
2,985.69
4,359.02
1,136.21
3,422.57
929.08
3,990.55
646.18
1,602.55
4,681.65
129
Korea
18,223
2,693.56
2,862.05
3,839.47
2,307.62
4,847.92
2,984.48
2,268.58
2,260.77
1,541.85
130
US
17,511
2,423.41
1,269.58
4,347.71
4,377.45
391.85
2,211.19
4,448.14
2,444.16
2,302.49
131
Germany
3,645
4,031.14
2,664.77
4,211.06
4,624.73
1,642.48
3,109.24
3,452.55
4,857.44
1,840.18
132
UK
10,443
6,416.96
2,288.94
2,502.75
195.85
4,728.30
4,228.91
3,005.80
3,639.58
3,350.34
133
Japan
19,368
7,972.75
1,773.70
177.65
702.08
2,962.02
4,639.31
237.63
980.23
637.55
134
Italy
18,630
5,676.90
4,697.76
2,131.52
4,521.92
2,697.41
757.81
164.16
3,323.39
271.13
135
Greece
7,837
5,130.64
1,688.88
2,076.67
3,446.03
408.88
1,002.79
682.95
4,991.64
994.01
136
Austria
14,753
649.29
3,561.12
1,385.32
1,901.53
3,346.42
1,961.34
4,975.88
4,753.83
1,305.49
137
Belgium
906
5,379.95
3,528.69
502.67
136.04
2,883.84
2,882.13
4,633.85
3,097.04
3,106.90
138
China
3,171
8,233.85
118.35
3,691.96
1,853.25
1,858.26
3,874.22
2,840.38
3,921.05
1,867.37
139
Korea
6,046
9,917.43
2,823.78
1,174.85
0.23
3,173.26
742.73
2,260.18
3,868.06
1,383.74
140
US
10,369
299.12
453.99
2,031.02
3,153.77
2,459.17
4,000.50
743.40
1,081.69
1,998.95
141
Germany
2,058
8,837.34
450.05
2,725.57
175.77
195.23
1,982.75
4,897.36
4,197.11
228.24
142
UK
14,545
5,097.02
1,342.31
675.14
4,464.27
3,112.94
4,440.97
3,991.78
2,746.26
88.67
143
Japan
8,076
6,913.78
3,225.22
476.45
341.95
1,834.87
1,883.50
4,058.54
44.60
2,321.44
144
Italy
8,539
5,742.19
759.77
4,598.61
232.67
4,322.76
2,717.57
3,130.37
3,986.41
2,077.16
145
Greece
9,507
3,885.65
1,443.19
4,095.50
1,446.09
4,072.28
4,829.50
117.08
1,733.11
3,626.94
146
Austria
15,300
8,496.48
1,861.12
2,089.42
3,203.71
2,449.59
2,156.08
4,539.91
4,302.74
3,943.03
147
Belgium
5,832
3,788.62
4,841.04
3,203.13
2,846.97
124.99
780.97
1,870.49
1,822.50
2,943.15
148
China
17,423
6,269.86
1,944.03
82.96
3,542.17
3,566.10
1,218.38
2,486.37
509.96
313.37
149
Korea
15,269
2,496.60
3,262.67
1,531.19
3,472.58
2,543.94
2,500.17
3,556.46
1,202.13
2,197.17
150
US
6,086
4,670.51
3,333.25
200.65
2,112.84
4,724.53
3,965.72
45.14
2,717.73
4,953.60
151
Germany
16,588
3,462.10
2,401.83
4,391.57
4,709.47
4,154.41
1,059.93
4,080.20
2,906.66
2,905.08
152
UK
8,106
9,856.59
1,353.77
275.29
3,814.90
2,560.84
4,710.12
2,822.18
345.63
186.57
153
Japan
2,484
2,747.51
528.49
2,961.79
2,409.04
397.51
701.00
566.92
1,305.93
778.64
154
Italy
9,764
4,186.18
2,559.65
2,873.45
4,689.90
1,629.33
1,273.07
2,718.49
2,149.45
382.95
155
Greece
9,839
5,885.59
3,175.12
1,986.83
4,349.83
4,554.54
3,086.80
4,384.04
4,941.84
256.74
156
Austria
5,542
3,087.04
4,123.20
380.33
4,891.62
2,554.72
800.12
1,479.63
2,456.24
4,510.74
157
Belgium
10,723
5,016.65
613.46
4.90
1,130.16
103.22
4,296.88
3,497.42
2,590.09
1,839.54
158
China
10,348
5,026.87
1,395.26
2,402.01
3,410.73
2,800.41
4,375.26
131.95
3,901.41
1,016.17
159
Korea
4,515
222.48
3,208.43
3,463.00
3,028.90
2,223.82
3,478.73
2,348.06
519.53
4,592.83
160
US
11,756
8,521.61
1,877.86
3,284.56
4,989.69
1,958.25
4,878.45
812.71
1,966.57
3,423.34
161
Germany
291
3,478.17
4,644.75
548.99
2,034.16
502.13
3,965.86
3,224.04
3,472.00
654.78
162
UK
5,536
7,632.70
737.73
4,856.54
1,301.65
1,832.51
3,440.36
3,283.17
4,151.30
1,459.06
163
Japan
16,072
1,105.57
1,350.60
40.82
2,005.90
4,608.98
398.22
1,794.90
4,131.99
3,570.08
164
Italy
11,616
7,066.21
3,061.01
2,749.17
2,655.82
280.35
4,222.11
2,005.83
3,036.53
1,844.04
165
Greece
495
3,241.02
4,164.40
767.13
3,784.36
2,878.66
2,769.00
217.87
2,841.04
305.52
166
Austria
10,673
1,699.47
4,570.85
1,290.65
813.70
514.89
2,201.23
2,758.67
4,539.11
2,610.68
167
Belgium
11,243
4,875.16
4,546.57
2,360.41
4,456.29
1,158.29
83.61
4,211.75
1,794.03
4,714.72
168
China
10,153
2,775.32
1,818.17
232.48
2,852.02
698.75
4,474.31
3,823.12
146.71
3,948.00
169
Korea
14,182
2,620.40
2,966.40
395.67
3,267.08
2,946.44
1,748.01
1,386.55
3,272.28
3,338.72
170
US
16,292
9,497.71
1,773.56
2,240.64
1,956.82
4,194.13
3,854.03
2,792.79
1,998.34
949.84
171
Germany
11,921
6,015.85
4,006.03
2,518.19
874.46
4,938.28
198.44
3,608.89
2,449.34
4,059.93
172
UK
13,356
602.94
1,244.27
1,319.64
497.17
118.29
1,873.21
2,588.29
626.59
4,224.43
173
Japan
17,253
9,898.86
2,111.20
1,877.97
4,861.83
2,016.19
3,082.61
355.27
2,501.07
2,890.72
174
Italy
13,129
8,685.70
4,627.19
65.16
43.24
994.15
26.52
2,255.87
483.78
2,771.34
175
Greece
6,343
6,207.07
703.81
3,734.91
4,973.49
4,602.92
1,126.52
1,749.32
4,801.42
3,676.25
176
Austria
4,170
1,381.43
1,319.19
1,773.00
4,246.16
4,086.98
2,789.47
3,363.97
3,228.74
3,015.65
177
Belgium
12,854
3,332.41
1,173.76
2,405.02
3,936.76
3,982.33
1,624.03
3,012.46
1,440.16
2,695.52
178
China
12,546
4,194.04
1,104.27
1,255.11
2,412.11
2,348.31
2,150.28
3,349.05
3,059.59
4,622.77
179
Korea
3,897
8,083.57
493.19
4,817.33
913.12
1,189.78
4,968.11
3,270.06
4,518.57
3,439.85
180
US
5,999
6,690.84
1,291.96
1,673.52
3,304.48
2,781.80
2,136.17
912.69
4,856.91
274.66
181
Germany
1,290
8,460.66
1,859.06
1,416.91
1,062.85
2,613.36
3,181.86
895.00
3,416.12
1,044.74
182
UK
10,905
9,261.65
92.50
68.73
2,096.44
953.36
3,320.95
1,343.62
100.86
3,720.78
183
Japan
16,502
5,856.90
3,541.90
4,002.27
3,984.61
2,886.27
1,166.73
3,928.58
302.47
2,103.60
184
Italy
18,788
5,949.58
1,841.50
3,790.28
4,903.03
4,643.88
1,196.00
2,684.43
44.06
3,728.20
185
Greece
12,871
7,280.41
1,527.07
4,838.82
873.67
4,017.32
3,837.23
4,803.69
1,692.55
564.14
186
Austria
3,487
2,466.76
4,220.16
1,313.32
3,657.78
473.65
1,116.65
3,403.26
2,717.58
4,330.41
187
Belgium
9,958
9,649.55
1,086.99
1,341.29
1,549.84
2,802.90
4,294.91
2,806.95
536.28
4,798.18
188
China
13,956
3,726.58
4,212.25
4,187.08
4,489.13
2,330.68
3,869.66
1,001.29
3,683.18
182.42
189
Korea
16,075
5,759.63
4,198.64
1,102.51
2,628.21
3,397.18
4,277.61
1,316.16
2,284.39
3,833.60
190
US
16,852
8,699.98
1,964.38
2,336.44
4,106.94
3,974.16
3,207.67
2,910.60
2,500.54
4,619.42
191
Germany
12,054
7,620.36
4,898.97
1,517.16
2,649.32
1,158.66
2,744.04
3,505.57
4,734.14
3,928.95
192
UK
19,909
5,655.44
3,650.14
3,187.79
1,819.82
322.37
3,227.47
2,406.47
3,708.34
2,215.44
193
Japan
9,580
8,458.54
1,779.56
2,574.79
4,652.28
3,346.60
3,441.89
2,569.44
3,556.78
2,176.88
194
Italy
18,808
641.74
4,606.69
4,639.08
170.33
3,180.49
658.41
4,067.50
1,072.61
1,644.14
195
Greece
16,993
1,736.23
753.69
4,633.96
2,256.74
1,478.27
3,282.39
126.73
283.72
4,093.71
196
Austria
8,951
2,507.91
4,132.14
4,203.76
4,096.17
2,061.99
2,448.63
4,704.68
1,404.59
2,818.46
197
Belgium
10,018
2,663.28
258.42
3,758.76
1,698.14
4,447.49
2,753.57
3,345.35
3,390.70
1,919.65
198
China
11,396
5,491.92
1,254.10
561.62
2,572.18
1,337.43
1,850.23
4,629.86
3,301.32
4,802.32
199
Korea
14,202
3,994.02
4,087.05
1,105.21
1,799.57
2,010.04
2,796.85
2,951.57
1,934.61
895.98
Important
Amount8
3,882.17
1,990.12
1,942.56
2,589.51
2,107.57
658.85
1,031.06
1,988.85
3,985.37
2,830.51
4,343.06
4,758.00
509.24
959.05
4,885.82
2,075.68
2,782.69
3,764.05
2,792.98
1,344.00
71.17
363.08
883.80
208.60
4,815.41
3,806.60
2,644.81
4,066.51
2,486.21
4,442.87
3,114.50
504.04
4,281.99
1,913.33
1,370.73
2,784.21
1,942.97
426.64
3,945.62
4,176.23
4,108.60
610.01
2,403.96
2,940.15
2,286.44
3,961.76
4,420.07
4,054.68
4,640.61
1,220.75
1,693.85
4,822.60
730.32
4,671.12
4,060.99
1,838.29
82.60
2,046.57
913.39
1,294.52
1,418.51
512.82
2,726.18
711.28
2,571.58
4,756.57
4,454.60
4,314.52
2,863.79
3,034.03
368.71
25.44
1,346.93
1,160.75
2,229.36
1,372.31
4,758.07
184.55
3,652.89
116.02
1,495.64
3,984.06
1,547.08
131.69
4,857.84
3,512.94
3,507.18
502.05
2,585.42
3,764.78
1,213.34
3,478.06
4,826.67
1,365.04
4,656.86
1,844.87
3,956.21
1,943.83
2,638.67
3,988.53
4,329.15
2,694.17
4,196.95
3,014.65
1,604.58
1,088.64
3,645.57
2,109.70
2,473.81
4,762.44
81.42
3,480.92
4,221.52
4,918.53
661.44
591.45
1,312.71
4,899.61
27.93
4,179.56
2,754.32
1,340.16
2,719.95
749.24
464.04
828.79
4,984.93
4,953.74
3,377.40
2,853.41
3,087.37
1,516.65
4,464.25
1,663.41
2,392.06
2,058.48
2,656.08
3,830.25
1,085.00
4,304.74
1,737.41
1,026.65
4,609.95
316.28
1,798.11
4,372.63
480.34
479.06
2,366.28
2,845.64
1,486.23
2,846.66
647.75
1,391.34
3,885.65
4,356.83
2,869.37
503.99
263.98
2,176.89
1,315.62
4,247.55
1,741.76
1,989.18
4,392.76
1,402.84
4,683.48
4,094.18
265.66
1,129.00
1,774.87
1,377.05
4,634.42
3,482.40
2,440.86
1,649.88
4,923.60
4,560.37
1,587.96
4,183.66
4,517.89
739.23
3,126.36
2,789.83
797.12
637.45
1,790.99
1,418.30
3,325.74
1,083.23
3,984.70
3,059.78
4,179.93
2,807.34
2,549.27
3,650.37
2,383.86
580.60
2,126.04
3,212.74
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
59
60
61
62
63
64
65
// This file locates: "Scripts/Lesson/C1FlexGrid/ColumnsMultiPaneGrids.js".
c1.documentReady(function () {
    var theGridLeft = wijmo.Control.getControl('#theGridLeft');
    theGridLeft.itemsSource = getData();
    theGridLeft.scrollPositionChanged.addHandler(function (s, e) {
        syncGrids(s, theGridRight)
    });
 
    var theGridRight = wijmo.Control.getControl('#theGridRight');
    theGridRight.itemsSource = theGridLeft.collectionView;
    theGridRight.scrollPositionChanged.addHandler(function (s, e) {
        syncGrids(s, theGridLeft)
    });
 
    // support wheel scrolling on both grids
    theGridLeft.hostElement.addEventListener('wheel', applyWheel);
    theGridRight.hostElement.addEventListener('wheel', applyWheel);
    function applyWheel(e) {
        var root = wijmo.closest(e.target, '[wj-part="root"]');
        if (root) {
            root.scrollTop += 32 * (e.deltaY < 0 ? -1 : +1);
            e.preventDefault();
        }
    }
 
    // synchronize the vertical scrolling position
    // NOTE: the selection is synchronized automatically since both
    // grids are bound to the same CollectionView
    function syncGrids(main, sub) {
        sub.scrollPosition = new wijmo.Point(sub.scrollPosition.x, main.scrollPosition.y);
    }
 
    // move the last two columns to the grid on the right
    theGridRight.columns.clear();
    for (var i = 0; i < 2; i++) {
        var lastCol = theGridLeft.columns[theGridLeft.columns.length - 1];
        theGridLeft.columns.remove(lastCol);
        theGridRight.columns.push(lastCol);
    }
 
    // get some random data
    function getData() {
        var countries = 'US,Germany,UK,Japan,Italy,Greece,Austria,Belgium,China,Korea'.split(','),
                data = [];
        for (var i = 0; i < 200; i++) {
            data.push({
                id: i,
                country: countries[i % countries.length],
                downloads: Math.round(Math.random() * 20000),
                sales: Math.random() * 10000,
                expenses: Math.random() * 5000,
                amount1: Math.random() * 5000,
                amount2: Math.random() * 5000,
                amount3: Math.random() * 5000,
                amount4: Math.random() * 5000,
                amount5: Math.random() * 5000,
                amount6: Math.random() * 5000,
                amount7: Math.random() * 5000,
                amount8: Math.random() * 5000,
                important: i % 5 == 0
            });
        }
        return data;
    }
});
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
// This file locates: "Content/css/Lesson/C1FlexGrid/ColumnsMultiPaneGrids.css".
/* the container for the grids */
.freeze-right {
  background: rgba(0,0,0,.1);
  border: 1px solid grey;
  height: 350px;
  width: auto;
  display: inline-block;
}
 
/* the grids in the container */
.freeze-right > .wj-flexgrid {
  display: inline-block;
  height: 100%;
  width: auto;
  max-width: 400px;
  border: none;
  border-radius: 0;
}
 
/* remove the vertical scrollbar from the grids grid */
.freeze-right > .wj-flexgrid:first-child div[wj-part=root] {
  overflow-y: hidden !important;
}
 
/* don't show selection on grids that don't have the focus */
.freeze-right .wj-flexgrid:not(.wj-state-focused) .wj-cell.wj-state-selected {
  background-color: inherit;
  color: inherit;
}
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: ColumnsMultiPaneGrids
        public ActionResult ColumnsMultiPaneGrids()
        {
            return View();
        }
    }
}
1
2
3
4
5
6
7
8
9
10
11
<h1>
    @Html.Raw(Resources.C1FlexGrid.ColumnsMultiPaneGrids_Title)
</h1>
<p>
    @Html.Raw(Resources.C1FlexGrid.ColumnsMultiPaneGrids_Text1)
</p>
 
<div class="freeze-right">
    @Html.C1().FlexGrid().Id("theGridLeft").ShowAlternatingRows(false)
    @Html.C1().FlexGrid().Id("theGridRight").ShowAlternatingRows(false).HeadersVisibility(C1.Web.Mvc.Grid.HeadersVisibility.Column)
</div>