Skip to content

Commit 72b7e83

Browse files
committed
Grid: finished merge of grid-markup into grid-editing
1 parent 4df489f commit 72b7e83

File tree

4 files changed

+45
-28
lines changed

4 files changed

+45
-28
lines changed

grid-editing/grid-row-editing.html

Lines changed: 12 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -5,6 +5,7 @@
55
<title>Grid: Editing, Inline Grid</title>
66
<link rel="stylesheet" href="../themes/base/jquery.ui.all.css">
77
<link rel="stylesheet" href="../grid-spf/grid.css">
8+
<link rel="stylesheet" href="../demos/demos.css">
89
<script src="../jquery-1.6.2.js"></script>
910
<script src="../external/jquery.tmpl.js"></script>
1011
<script src="../external/jquery.mousewheel-3.0.4.js"></script>
@@ -77,7 +78,16 @@
7778

7879
<h1>Grids with full row inline editing</h1>
7980

81+
<div style="width:46em;">
8082
<table id="developers-local">
83+
<colgroup>
84+
<col width="19%">
85+
<col width="19%">
86+
<col width="18%">
87+
<col width="12%">
88+
<col width="12%">
89+
<col width="20%">
90+
</colgroup>
8191
<thead>
8292
<tr>
8393
<th data-property="firstName">First Name</th>
@@ -91,9 +101,10 @@ <h1>Grids with full row inline editing</h1>
91101
<tbody>
92102
</tbody>
93103
</table>
104+
</div>
94105

95106
<script id="cell-edit-tmpl" type="text/x-jquery-tmpl">
96-
<td><button class='edit'>Toggle Edit</button></td>
107+
<td class="ui-widget-content"><button class='edit'>Toggle Edit</button></td>
97108
</script>
98109

99110
</body>

grid-editing/grid-selectable.html

Lines changed: 6 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -5,6 +5,7 @@
55
<title>Grid: Selectable Editing</title>
66
<link rel="stylesheet" href="../themes/base/jquery.ui.all.css">
77
<link rel="stylesheet" href="../grid-spf/grid.css">
8+
<link rel="stylesheet" href="../demos/demos.css">
89
<script src="../jquery-1.6.2.js"></script>
910
<script src="../external/globalize.js"></script>
1011
<script src="../external/jquery.tmpl.js"></script>
@@ -139,13 +140,10 @@
139140
});
140141
</script>
141142
<style>
142-
.ui-selecting td { background: #eef; }
143-
.ui-selected td { background: #ddf; }
143+
.ui-grid .ui-selecting td { background: #eef; }
144+
.ui-grid .ui-selected td { background: #ddf; }
144145
.navigator-active { background: rgba(0,0,255,0.5) !important; }
145146
.ui-autocomplete { width: 200px; max-height: 200px; overflow: auto; }
146-
#developers-local {
147-
width: 500px;
148-
}
149147
thead td { text-align: center; }
150148
</style>
151149
</head>
@@ -155,11 +153,10 @@ <h1>Grids with selectable rows</h1>
155153

156154
<h2>local data source</h2>
157155

156+
<div style="width:50em;">
158157
<table id="developers-local">
158+
<caption>Developers Grid</caption>
159159
<thead>
160-
<tr>
161-
<td colspan="5" class="ui-widget-header">Developers Grid</td>
162-
</tr>
163160
<tr>
164161
<th data-property="firstName">First Name</th>
165162
<th data-property="lastName">Last Name</th>
@@ -185,6 +182,7 @@ <h2>local data source</h2>
185182
</tr>
186183
</tfoot>
187184
</table>
185+
</div>
188186

189187
<div>
190188
<button id="addDeveloper">Insert new developer before selection (start if none selected)</button>

grid-editing/grid.html

Lines changed: 25 additions & 15 deletions
Original file line numberDiff line numberDiff line change
@@ -5,6 +5,7 @@
55
<title>Grid: Editing, Inline Grid</title>
66
<link rel="stylesheet" href="../themes/base/jquery.ui.all.css">
77
<link rel="stylesheet" href="../grid-spf/grid.css">
8+
<link rel="stylesheet" href="../demos/demos.css">
89
<script src="../jquery-1.6.2.js"></script>
910
<script src="../external/globalize.js"></script>
1011
<script src="../external/jquery.tmpl.js"></script>
@@ -108,9 +109,6 @@
108109
<style>
109110
.navigator-active { background: rgba(0,0,255,0.1); }
110111
.ui-autocomplete { width: 200px; max-height: 200px; overflow: auto; }
111-
#developers-local {
112-
width: 700px;
113-
}
114112
thead td { text-align: center; }
115113
#pageDevelopers { text-align: center; }
116114
.totals { padding-left: 1em; }
@@ -125,21 +123,32 @@ <h1>Grids with editable local dataview</h1>
125123

126124
<h2>local data source</h2>
127125
<p>See also <a href="grid-selectable.html">grid-selectable</a></p>
126+
127+
<div style="width:80em;">
128128
<table id="developers-local">
129+
<caption>Developers Grid</caption>
130+
<colgroup>
131+
<col width="12%">
132+
<col width="12%">
133+
<col width="12%">
134+
<col width="10.34483%">
135+
<col width="12%">
136+
<col width="13.79310%">
137+
<col width="10.34483%">
138+
<col width="6.896552%">
139+
<col width="10.34483%">
140+
</colgroup>
129141
<thead>
130142
<tr>
131-
<td colspan="9" class="ui-widget-header">Developers Grid</td>
132-
</tr>
133-
<tr>
134-
<th width="70" data-property="firstName">First Name</th>
135-
<th width="70" data-property="lastName">Last Name</th>
136-
<th width="70" data-property="country" data-editor="countrycomplete">Country</th>
137-
<th width="60" data-property="bitcoins" data-type="number" data-editor="spinner">Bitcoins</th>
138-
<th width="70" data-template="#cell-date-tmpl">Date</th>
139-
<th width="80" data-template="#cell-time-tmpl">Time</th>
140-
<th width="60" data-property="random.value" data-type="number" data-editor="randomSpinner" data-editor-options='{"min":-1, "max": 125}'>Random</th>
141-
<th width="40" data-template="#cell-edit-tmpl">Edit</th>
142-
<th width="60" data-template="#cell-remove-tmpl">Remove</th>
143+
<th data-property="firstName">First Name</th>
144+
<th data-property="lastName">Last Name</th>
145+
<th data-property="country" data-editor="countrycomplete">Country</th>
146+
<th data-property="bitcoins" data-type="number" data-editor="spinner">Bitcoins</th>
147+
<th data-template="#cell-date-tmpl">Date</th>
148+
<th data-template="#cell-time-tmpl">Time</th>
149+
<th data-property="random.value" data-type="number" data-editor="randomSpinner" data-editor-options='{"min":-1, "max": 125}'>Random</th>
150+
<th data-template="#cell-edit-tmpl">Edit</th>
151+
<th data-template="#cell-remove-tmpl">Remove</th>
143152
</tr>
144153
</thead>
145154
<tbody>
@@ -161,6 +170,7 @@ <h2>local data source</h2>
161170
</tr>
162171
</tfoot>
163172
</table>
173+
</div>
164174

165175
<div>
166176
<button id="addDeveloper">Insert new developer</button>

grid-editing/spreadsheet.html

Lines changed: 2 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -5,6 +5,7 @@
55
<title>Grid: Editing, Inline Grid</title>
66
<link rel="stylesheet" href="../themes/base/jquery.ui.all.css">
77
<link rel="stylesheet" href="../grid-spf/grid.css">
8+
<link rel="stylesheet" href="../demos/demos.css">
89
<script src="../jquery-1.6.2.js"></script>
910
<script src="../external/globalize.js"></script>
1011
<script src="../external/jquery.tmpl.js"></script>
@@ -60,10 +61,7 @@
6061
});
6162
</script>
6263
<style>
63-
.navigator-active { background: rgba(0,0,255,0.2); }
64-
#spreadsheet {
65-
width: 100%;
66-
}
64+
.ui-grid tr .navigator-active { background: rgba(0,0,255,0.2); }
6765
thead td { text-align: center; }
6866
</style>
6967
</head>

0 commit comments

Comments
 (0)