Skip to content

Commit e653201

Browse files
committed
Added large.html as a test for huge datrasets (here: a 1000 rows)
1 parent 44a29b5 commit e653201

File tree

1 file changed

+105
-0
lines changed

1 file changed

+105
-0
lines changed

tests/visual/grid/large.html

Lines changed: 105 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,105 @@
1+
<!DOCTYPE html>
2+
<html lang="en">
3+
<head>
4+
<meta charset="utf-8">
5+
<title>Grid: Data</title>
6+
<link rel="stylesheet" href="../visual.css">
7+
<link rel="stylesheet" href="../../../themes/base/jquery.ui.all.css">
8+
<link rel="stylesheet" href="grid.css">
9+
<script src="../../../jquery-1.4.4.js"></script>
10+
<script src="../../../external/jquery.tmpl.js"></script>
11+
<script src="../../../ui/jquery.ui.core.js"></script>
12+
<script src="../../../ui/jquery.ui.widget.js"></script>
13+
<script src="dataitem.js"></script>
14+
<script src="datasource.js"></script>
15+
<script src="datastore.js"></script>
16+
<script src="grid.js"></script>
17+
<script>
18+
// TODO this isn't used anywhere - how to access this method from #row-tmpl?
19+
// grid passed dataitem.options.data, that doesn't include access to this method
20+
$.ui.dataitem.extend( "random", {});
21+
22+
var input = [
23+
[
24+
"100",
25+
"200",
26+
"300",
27+
"400",
28+
"500",
29+
"1000",
30+
"2000"
31+
],
32+
[
33+
"Alpha",
34+
"Beta",
35+
"Gamma",
36+
"Zeta",
37+
"Özgan",
38+
"Ågren"
39+
],
40+
[
41+
"2011-01-01",
42+
"2011-05-07",
43+
"2012-12-15",
44+
"1948-05-30"
45+
],
46+
[
47+
"Alpha",
48+
"Beta",
49+
"Gamma",
50+
"Zeta",
51+
"Özgan",
52+
"Ågren",
53+
"100",
54+
"200",
55+
"300",
56+
"400",
57+
"500",
58+
"1000",
59+
"2000",
60+
"2011-01-01",
61+
"2011-05-07",
62+
"2012-12-15",
63+
"1948-05-30"
64+
]
65+
];
66+
var columns = [ "number", "names", "dates", "mixed" ];
67+
var data = [];
68+
for ( var i = 0; i < 1000; i++ ) {
69+
var row = data[data.length] = {};
70+
for ( var j = 0; j < 4; j++ ) {
71+
var random = input[ j ][ Math.floor( Math.random() * input[ j ].length ) ];
72+
row[ columns[ j ] ] = random;
73+
}
74+
}
75+
76+
$.ui.datasource({
77+
type: "random",
78+
source: data
79+
});
80+
81+
$(function() {
82+
$( "#random" ).grid({
83+
type: "random",
84+
columns: columns
85+
});
86+
});
87+
</script>
88+
</head>
89+
<body>
90+
91+
<table id="random">
92+
<thead>
93+
<tr>
94+
<th data-field="number">Number</th>
95+
<th data-field="names">Names</th>
96+
<th data-field="dates">Dates</th>
97+
<th data-field="mixed">Mixed</th>
98+
</tr>
99+
</thead>
100+
<tbody>
101+
</tbody>
102+
</table>
103+
104+
</body>
105+
</html>

0 commit comments

Comments
 (0)