Grid Editing: Same markup update as for other demos on grid-selectable

jzaefferer · jzaefferer · commit 7a9f501deaec · 2011-08-20T11:56:23.000+02:00
diff --git a/grid-editing/grid-selectable.html b/grid-editing/grid-selectable.html
@@ -175,27 +175,23 @@
 		.ui-selected td { background: #ddf; }
 		.navigator-active { background: rgba(0,0,255,0.5) !important; }
 		.ui-autocomplete { width: 200px; max-height: 200px; overflow: auto; }
+		#developers-local {
+			width: 500px;
+		}
+		thead td { text-align: center; }
 	</style>
 </head>
 <body>
 
 <h1>Grids with editable local datasource</h1>
 
 <h2>local data source</h2>
-<p id="pageDevelopers">
-	<button data-page="first">First</button>
-	<button data-page="prev">Prev</button>
-	<button data-page="prevStep">-1</button>
-	<span>
-		Page <input class="current" size="4"/>/<span class="total">0</span>,
-		Total records <span class="totalRecords">0</span>
-	</span>
-	<button data-page="nextStep">+1</button>
-	<button data-page="next">Next</button>
-	<button data-page="last">Last</button>
-</p>
+
 <table id="developers-local">
 	<thead>
+		<tr>
+			<td colspan="5" class="ui-widget-header">Developers Grid</td>
+		</tr>
 		<tr>
 			<th data-property="firstName">First Name</th>
 			<th data-property="lastName">Last Name</th>
@@ -208,7 +204,16 @@ <h2>local data source</h2>
 	</tbody>
 	<tfoot>
 		<tr>
-			<td colspan="5"><span class="selected-status">0</span> row(s) selected</td>
+			<td id="pageDevelopers" colspan="5" class="ui-state-default">
+				<span class="selected-status">0</span> row(s) selected
+				<button data-page="first">First</button>
+				<button data-page="prev">Prev</button>
+				<span>
+					Page <input class="current" size="4"/> of <span class="total">0</span>
+				</span>
+				<button data-page="next">Next</button>
+				<button data-page="last">Last</button>
+			</td>
 		</tr>
 	</tfoot>
 </table>
