Skip to content

Commit cdd2589

Browse files
committed
Initial prototype for grid markup.
1 parent 9964356 commit cdd2589

File tree

3 files changed

+83
-0
lines changed

3 files changed

+83
-0
lines changed

grid-markup/grid.css

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,3 @@
1+
/*
2+
* grid.css
3+
*/

grid-markup/grid.html

Lines changed: 50 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,50 @@
1+
<!DOCTYPE html>
2+
<html lang="en">
3+
<head>
4+
<meta charset="utf-8">
5+
<title>Grid: Markup</title>
6+
<style>body{font:62.5% Verdana,Arial,sans-serif}</style>
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="../ui/jquery.ui.core.js"></script>
11+
<script src="../ui/jquery.ui.widget.js"></script>
12+
<script src="grid.js"></script>
13+
<script>
14+
$(function() {
15+
$( "#dataTable1" ).grid();
16+
});
17+
</script>
18+
</head>
19+
<body>
20+
21+
<table id="dataTable1">
22+
<thead>
23+
<tr>
24+
<th>First Name</th>
25+
<th>Last Name</th>
26+
<th>Country</th>
27+
<th>Twitter</th>
28+
<th>GitHub</th>
29+
</tr>
30+
</thead>
31+
<tbody>
32+
<tr>
33+
<td>John</td>
34+
<td>Resig</td>
35+
<td>USA</td>
36+
<td>jeresig</td>
37+
<td>jeresig</td>
38+
</tr>
39+
<tr>
40+
<td>Scott</td>
41+
<td>Jehl</td>
42+
<td>USA</td>
43+
<td>filamentgroup</td>
44+
<td>scottjehl</td>
45+
</tr>
46+
</tbody>
47+
</table>
48+
49+
</body>
50+
</html>

grid-markup/grid.js

Lines changed: 30 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,30 @@
1+
/*
2+
* grid.js
3+
*/
4+
(function( $ ) {
5+
6+
$.widget( "ui.grid", {
7+
options: {},
8+
_create: function() {
9+
var uiGrid = ( this.uiDialog = $("<div class='ui-widget ui-grid'></div>") )
10+
.insertBefore( this.element ),
11+
12+
uiGridHead = ( this.uiGridHead = $("<div class='ui-widget-header ui-grid-head'></div>") )
13+
.appendTo( uiGrid ),
14+
15+
uiGridBody = ( this.uiGridBody = $("<div class='ui-widget-content ui-grid-body'></div>") )
16+
.appendTo( uiGrid ),
17+
18+
uiGridBodyTable = ( this.uiGridBodyTable = $("<table></table") )
19+
.appendTo( uiGridBody ),
20+
21+
uiGridHeadTable = this.element
22+
.appendTo( uiGridHead );
23+
24+
uiGridHeadTable.find("tbody")
25+
.appendTo( uiGridBodyTable );
26+
27+
}
28+
});
29+
30+
}( jQuery ));

0 commit comments

Comments
 (0)