问题描述
我用的是editable datagrid,这里边的分页要自己去实现,我后台可以得到当前页和行数,所以分页没什么问题,只是我不知道在哪里获取它点击下一页的这个事件,也就是说我不知道它在哪里设置当点击下一页的时候,去调用我后台分页的函数获得json?代码:$(function(){ var lastIndex; $('#tt').datagrid({ title:'用户管理', iconCls:'icon-edit', width:800, height:400, singleSelect:false, idField:'itemid', url:'jsonsw!json.action', pagination:true, checkbox:true, columns:[[ {field:'t_user_id',checkbox:true,align:'center'}, {field:'login_name',title:'用户名',width:180,align:'center'}, {field:'name',title:'姓名',width:100,align:'center'}, {field:'sex',title:'性别',width:80,align:'center'}, {field:'cdate',title:'创建日期',width:100,align:'center'}, {field:'p_name',title:'所属部门',width:150}, {field:'state',title:'状态',width:60,align:'center' } ]], toolbar:[{ text:'append', iconCls:'icon-add', handler:function(){ $('#tt').datagrid('endEdit', lastIndex); $('#tt').datagrid('appendRow',{ itemid:'', productid:'', listprice:'', unitprice:'', attr1:'', status:'P' }); var lastIndex = $('#tt').datagrid('getRows').length-1; $('#tt').datagrid('beginEdit', lastIndex); } },'-',{ text:'delete', iconCls:'icon-remove', handler:function(){ var row = $('#tt').datagrid('getSelected'); if (row){ var index = $('#tt').datagrid('getRowIndex', row); $('#tt').datagrid('deleteRow', index); } } },'-',{ text:'accept', iconCls:'icon-save', handler:function(){ $('#tt').datagrid('acceptChanges'); } },'-',{ text:'reject', iconCls:'icon-undo', handler:function(){ $('#tt').datagrid('rejectChanges'); } },'-',{ text:'getChanges', iconCls:'icon-search', handler:function(){ var rows = $('#tt').datagrid('getChanges'); alert('changed rows: ' + rows.length + ' lines'); } }], onBeforeLoad:function(){ $(this).datagrid('rejectChanges'); }, onClickRow:function(rowIndex){ alert("ss"); if (lastIndex != rowIndex){ $('#tt').datagrid('endEdit', lastIndex); $('#tt').datagrid('beginEdit', rowIndex); } lastIndex = rowIndex; } }); }); 问题补充:cuiran 写道
解决方案
easyui里面默认会向后台传递page和rows 这2个参数,你可以直接从request中获取。然后获取当前数目。就好控制分页了。示例:Struts的action方法:public String data() throws Exception { Map<String, Object> params = new HashMap<String, Object>(); userPage = userService.findByPage(params, page, rows); Map map = new HashMap(); map.put("total", userPage.getTotalRows()); map.put("rows", userPage.getResultList()); Struts2Utils.renderJson(map); return null;}页面的js:grid = $('#user-table').datagrid({ url:'upc/user!data.action', pagination:true, ... });
解决方案二:
jquery easyui 中会有page和rows两个参数,这两个属性代表 当前页码和每页记录数。而且jquery easyui是通过 ajax传递数据的,自动会将 page和rows两个参数代入的,即在提交数据时,你写的格式是:url:'jsonsw!json.action', 事实上,他和传递着 例如{page:1,rows:10,sortName:'',sortOrder:''}等等参数。这样讲你应该就明白了,它是以request的parameter传递到后台,你只需要获取就行了,如果你用的是struts2,那么定义两个参数 如楼上的:引用private int page = 1; private int rows = 10; 会自动获取的,并且还有一点,就是你根本就不用把page和rows返回到客户端,客户端会自动计算。
解决方案三:
action中要有变量和其get/set方法:private int page = 1;private int rows = 10;
解决方案四:
jquery-easyui中使用datagrid来加载远程数据,必须设置url属性,如下所示:$('#ts').datagrid({ title:'Load Data', iconCls:'icon-save', width:400, height:250, url:'/demo3/data/getItems', columns:[[ {field:'itemid',title:'Item ID',width:80}, {field:'productid',title:'Product ID',width:80}, {field:'listprice',title:'List Price',width:80,align:'right'}, {field:'unitcost',title:'Unit Cost',width:80,align:'right'}, {field:'attr1',title:'Attribute',width:100}, {field:'status',title:'Status',width:60} ]], pagination:true});分页时需要设置pagination:true,这样,在表格下方将显示分页工具栏。分页工具栏将向服务器发送二个参数:•page: 页号,从1计起。•rows: 每页记录大小。然后在后台定义数据模型。希望对你有所启发。