Use Easyui to add pagination to the DataGrid

@author YHC

This example shows how we load data from the server side and how to add pagination to the DataGrid.

View Demo

Creating a DataGrid

Loading data from the server side, you should set the ' URL ' attribute on your server side you should return JSON format data. See the DataGrid document for more information about its data format.

<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= ">item id</th> <th field=" "ProductID" Width= ">product"  
            id</th>  
            <th field= "ListPrice" width= "align=" right ">list price</th>" <th  
            " UnitCost "width=" align= "right" >unit cost</th> <th field= "attr1" width= ">attribute</th"  
            >  
            field= "status" width= "<th" align= "center" >Stauts</th>  
        </tr>  
    </thead >  
</table>  

We define the DataGrid and set the ' pagination ' property to True, it will generate a paging toolbar at the bottom of the DataGrid, pagination will send 2 parameters to the server:

Page: page number, starting with a value of 1. Rows: Display row server- side code per page

$page = isset ($_post[' page ')? Intval ($_post[' page '): 1;  
$rows = isset ($_post[' rows '])? Intval ($_post[' rows ']): ten;  
// ...  
$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);  

Download Easyui Sample code:Easyui-datagrid-demo.zip