//从后台去数据到前台显示
//js 端
//加载数据
$('#tableContent').datagrid({
title:'不可编辑datagrid列表 ',
width:'auto',
height:'auto',
striped:true,
singleSelect: true,
url:’’,
queryParams:{},
loadMsg:'数据加载中请稍后……',
//开启分页组件
pagination:true,
//初始化每页显示条数
pageSize:10,
//初始化当前页,如果不设置,在已转向其他页码的页面上,点查询,会出现还是查询上次//页面的数据,不能从第一页开始
pageNumber:1,
rownumbers:true,
fitColumns:true,
toolbar:[{
text:'新增',
iconCls:'icon-add',
handler:function(){
//添加操作
}
}],
columns:[[
{field:'id' ,title: ' ID', align: 'center'},
{field:'name',title: '名称',align: 'center'
]],
onLoadSuccess: function(data){
//数据加载成功后操作
}
});
//设置分页控件 此控件在上一页下一页跳转时会向后台传递page和rows俩个参数,分别//代表当前页码和每页包含条数,所以在java端必须getter,setter这俩个参数
var p = $('#tableContent').datagrid('getPager');
p.pagination( {
//pageSize: 10,//每页显示的记录条数,默认为10
//pageList: [5,10,15],//可以设置每页记录条数的列表
beforePageText: '第',//页数文本框前显示的汉字
afterPageText: '页 共 {pages} 页',
displayMsg: '当前显示 {from} - {to} 条记录 共 {total} 条记录',
onBeforeRefresh: function() {
$(this).pagination('loading');
$(this).pagination('loaded');
}
});
/--------html端
<div id="tableContent"></div>
/JAVA端
private JSONObject result;
private String page;
private String rows;
//省略getter,setter
public String queryList()
{
//当前页
int intPage = Integer.parseInt((page == null || page == "0") ? "1":page);
//每页显示条数
int number = Integer.parseInt((rows == null || rows == "0") ? "10":rows);
HashMap hm = new HashMap();
List<HashMap> list=new ArrayList<HashMap>();
HashMap hm = new HashMap();
hm.put("id","1");
hm.put("name","liming");
list.add(hm);
hm = new HashMap();
hm.put("id","2");
hm.put("name","limi");
list.add(hm);
JSONObject retjson= new JSONObject();
retjson.put("total", 2);
retjson.put("rows", list );
System.out.println(retjson.toString());
//此方式需struts2,json插件支持,
// <result type="json">
// <param name="root">result</param>
// </result>
//此中type="json" 需自定义result-type
result = retjson;
returnSUCCESS;
}