jEasyUI menambah komponen paging


Contoh ini menunjukkan cara memuatkan data daripada pelayan dan cara menambahkan penomboran pada grid data.

85.png

Buat DataGrid

Untuk memuatkan data dari bahagian pelayan jauh, anda harus menetapkan atribut 'url', yang sepatutnya mengembalikan data format JSON pada bahagian pelayan anda. Lihat dokumentasi grid data untuk mendapatkan maklumat lanjut tentang format datanya.

	<table id="tt" class="easyui-datagrid" style="width:600px;height:250px"
			url="datagrid2_getdata.php"
			title="Load Data" iconCls="icon-save"
			rownumbers="true" pagination="true">
		<thead>
			<tr>
				<th field="itemid" width="80">Item ID</th>
				<th field="productid" width="80">Product ID</th>
				<th field="listprice" width="80" align="right">List Price</th>
				<th field="unitcost" width="80" align="right">Unit Cost</th>
				<th field="attr1" width="150">Attribute</th>
				<th field="status" width="60" align="center">Stauts</th>
			</tr>
		</thead>
	</table>

Kami mentakrifkan lajur datagrid dan menetapkan atribut 'penomboran' kepada benar, yang akan menjana bar alat penomboran di bahagian bawah grid data. penomboran akan menghantar dua parameter ke pelayan:

  • halaman: nombor halaman, nilai permulaan 1.

  • baris: Paparkan baris setiap halaman.

Kod sisi pelayan

	$page = isset($_POST['page']) ? intval($_POST['page']) : 1;
	$rows = isset($_POST['rows']) ? intval($_POST['rows']) : 10;
	// ...
	$rs = mysql_query("select count(*) from item");
	$row = mysql_fetch_row($rs);
	$result["total"] = $row[0];
	
	$rs = mysql_query("select * from item limit $offset,$rows");
	
	$items = array();
	while($row = mysql_fetch_object($rs)){
		array_push($items, $row);
	}
	$result["rows"] = $items;
	
	echo json_encode($result);

Muat turun contoh jQuery EasyUI

jeasyui-datagrid-datagrid2.zip