jQuery EasyUI使用教程之在數據網格中添加一個分頁

<jQuery EasyUI最新版下載>

本教程中涉及的示例演示瞭如何從服務器端加載數據，如何添加分頁組件到數據網格中。

查看演示

建立數據網格

想要從遠程服務器端加載數據，首先你應該設置「URL」屬性，服務器端會返回JSON格式的數據。查看數據文檔可得到更多的數據格式信息。

< 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 >

咱們定義數據網格列，並設置「pagination」屬性爲true，所以在數據網格的底部會生成一個分頁工具欄。pagination將發送兩個參數到服務器：

• page：頁碼，起始值 1

• rows：每頁顯示行

服務器端代碼

$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);

下載該EasyUI示例：easyui-datagrid-demo.zip

有興趣的朋友能夠點擊查看更多有關jQuery EasyUI的文章！