用datagrid分页显示数据,后台ThinkPHP代码怎么写?
为什么点击datagrid的下一页,datagrid不能加载刷新第2页的数据?
我的思路:
①index渲染模板
②supplier_list.html引入的supplier_list.js利用jquery的$(document).ready(function(){$('#list0').datagrid(//此处省略代码...);});来加载datagrid的数据。
后台代码如下(index()渲染模板,read()为前台datagrid加载数据):
<?php
/**
class SupplierAction extends Action{
public function index(){
$this->assign('title','供应商列表');
$this->display("Supplier:supplier_list");
}
//获取供应商列表
public function read(){
$supplier=M('Supplier');
//当前第几页
$pagenum=isset($_POST['page'])? intval($_POST['page']):1;
//每页显示的记录数
$pagesize=isset($_POST['rows'])? intval($_POST['rows']):10;
if(isset($_POST['keyword'])){
$map['name']=array('like',array('%'.$_POST['keyword'].'%'));
}else{
$map['_string']='1=1';
}
//import('@.ORG.Util.Page');
//$Page=new Page($total,$pagesize); //实例化分页类 传入总记录数
//进行分页数据查询 注意page方法的参数的前面部分是当前的页数,使用$_GET[p]获取
//$list2=$supplier->page($pagenum.','.$Page->listRows)->order('ctime')->select();
$list=$supplier->where($map)->limit(($pagenum-1)*$pagesize.','.$pagesize)->order('ctime')->select();
$total=$supplier->where($map)->count(); //查询满足条件的总记录数
$jsonStr='{"total":'.$total.',"rows":'.json_encode($list).'}';
echo $jsonStr;
}
//js代码
//设置分页插件
var p=$("#list0").datagrid('getPager');
/*分页插件*/
$(p).pagination({
pageNumber:1, //显示的页数
pageSize:10, //每页显示的大小
pageList:[10,20,30,50],
beforePageText:'第', //页数文本框前显示的汉字
afterPageText:'页 共{pages}页',
displayMsg:'当前显示{from}-{to}条记录 共{total}条记录',
onSelectPage:function(pageNumber,pageSize){
//选择相应的页码时刷新显示的内容列表
//var queryParams=$("#list0").datagrid('options').queryParams;
//queryParams.PageNumber=pageNumber;
//queryParams.PageSize=pageSize;
$("#list0").datagrid('reload',{page:pageNumber,rows:pageSize});
}
});
点击datagrid下方的pagination控件的下一页,datagrid不能刷新显示第二页的数据?这是为什么呢?
$(p).pagination({最后这个的问题。。reload方法无法更改内置的page查询参数的,这个只能游datagrid控制,你用开发工具看发起的请求就知道了,page一直是1没变。。
另外给起一个参数名称newpage,然后修改你的php代码当前页控制的键名称
$("#list0").datagrid('reload',{newpage:pageNumber,rows:pageSize});
或者用内置的导航就行了,不需要自己重新写过pagination,要是想本地化,导入locale/easyui-lang-zh_cn.js语言包就行
<script type="text/javascript" src="../../jquery.easyui.min.js"></script>
<script type="text/javascript" src="../../locale/easyui-lang-zh_CN.js" charset="utf-8"></script>