This example shows how to obtain data from the database and displayed in the data grid (DataGrid) in them. Then demonstrates how to display search results based on search keywords entered by the user.
Create a data grid (DataGrid)
Create a data grid with pagination (datagrid), then add a toolbar to it.
url="datagrid24_getdata.php" toolbar="#tb"
title="Load Data" iconCls="icon-save"
rownumbers="true" pagination="true">
| Item ID | Product ID | List Price | Unit Cost | Attribute | status was based |
|---|
Toolbars are defined as follows:
When a user enters a query value and press the search button, 'doSearch' function will be called:
doSearch function () {
$('#tt').datagrid('load',{
itemid: $('#itemid').val(),
productid: $('#productid').val()
});
}
The above code calls a 'load' method to load new data grid (DataGrid) data. We need to pass the 'itemid' and 'productid' parameter to the server.
Server-side code
include 'conn.php';
$page = isset($_POST['page']) ? intval($_POST['page']) : 1;
$rows = isset($_POST['rows']) ? intval($_POST['rows']) : 10;
$itemid = isset($_POST['itemid']) ? mysql_real_escape_string($_POST['itemid']) : '';
$productid = isset($_POST['productid']) ? mysql_real_escape_string($_POST['productid']) : '';
$offset = ($page-1)*$rows;
$result = array();
$where = "itemid like '$itemid%' and productid like '$productid%'";
$rs = mysql_query("select count(*) from item where " . $where);
$row = mysql_fetch_row($rs);
$result["total"] = $row[0];
$rs = mysql_query("select * from item where " . $where . " limit $offset,$rows");
$items = array();
while($row = mysql_fetch_object($rs)){
array_push($items, $row);
}
$result["rows"] = $items;
echo json_encode($result);
Download jQuery EasyUI examples
jeasyui-datagrid-datagrid24.zip (edit: Leilin Peng Source: network intrusion deleted)