Spaces:
Sleeping
Sleeping
Update data_gc_tab.html
Browse files- data_gc_tab.html +22 -43
data_gc_tab.html
CHANGED
@@ -1,56 +1,35 @@
|
|
1 |
-
<!doctype html>
|
2 |
<!DOCTYPE html>
|
3 |
<html lang="en">
|
4 |
<head>
|
5 |
<meta charset="UTF-8">
|
6 |
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
7 |
<title>Tabulator Example</title>
|
8 |
-
<link href="https://unpkg.com/tabulator-tables@6.2.1/dist/css/tabulator.min.css" rel="stylesheet">
|
9 |
-
<script type="text/javascript" src="https://unpkg.com/tabulator-tables@6.2.1/dist/js/tabulator.min.js"></script>
|
10 |
</head>
|
11 |
-
|
12 |
-
|
13 |
-
<style>
|
14 |
-
|
15 |
-
|
16 |
-
|
17 |
-
|
18 |
-
</style>
|
19 |
<body>
|
20 |
-
|
21 |
-
|
22 |
-
|
23 |
-
|
24 |
-
|
25 |
-
|
26 |
-
|
27 |
-
|
28 |
|
29 |
<script>
|
30 |
-
var tableData = [
|
31 |
-
|
32 |
-
|
33 |
-
]
|
34 |
-
|
35 |
-
var table = new Tabulator("#example-table", {
|
36 |
-
|
37 |
-
|
38 |
-
|
39 |
-
|
40 |
-
|
41 |
-
|
42 |
-
|
43 |
-
|
44 |
-
|
45 |
-
|
46 |
-
|
47 |
-
|
|
|
48 |
</script>
|
49 |
-
|
50 |
-
|
51 |
-
|
52 |
-
|
53 |
-
|
54 |
-
|
55 |
</body>
|
56 |
</html>
|
|
|
|
|
1 |
<!DOCTYPE html>
|
2 |
<html lang="en">
|
3 |
<head>
|
4 |
<meta charset="UTF-8">
|
5 |
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
6 |
<title>Tabulator Example</title>
|
7 |
+
<link href="https://unpkg.com/tabulator-tables@6.2.1/dist/css/tabulator.min.css" rel="stylesheet">
|
8 |
+
<script type="text/javascript" src="https://unpkg.com/tabulator-tables@6.2.1/dist/js/tabulator.min.js"></script>
|
9 |
</head>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
10 |
<body>
|
11 |
+
<div id="example-table"></div>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
12 |
|
13 |
<script>
|
14 |
+
var tableData = [
|
15 |
+
{id:1, name:"Billy Bob", age:"12", progress: 36, gender:"male", height:1, col:"red", dob:"", cheese:1},
|
16 |
+
{id:2, name:"Mary May", age:"1", progress: 36, gender:"female", height:2, col:"blue", dob:"14/05/1982", cheese:true},
|
17 |
+
];
|
18 |
+
|
19 |
+
var table = new Tabulator("#example-table", {
|
20 |
+
data: tableData, // set initial table data
|
21 |
+
layout: "fitDataFill", // fit columns to width of table
|
22 |
+
columns: [
|
23 |
+
{title:"Name", field:"name"},
|
24 |
+
{title:"Age", field:"age"},
|
25 |
+
{title:"Progress", field:"progress", sorter:"number", formatter:"progress"},
|
26 |
+
{title:"Gender", field:"gender"},
|
27 |
+
{title:"Height", field:"height"},
|
28 |
+
{title:"Favourite Color", field:"col"},
|
29 |
+
{title:"Date Of Birth", field:"dob"},
|
30 |
+
{title:"Cheese Preference", field:"cheese"},
|
31 |
+
],
|
32 |
+
});
|
33 |
</script>
|
|
|
|
|
|
|
|
|
|
|
|
|
34 |
</body>
|
35 |
</html>
|