1. 通过ajax同步获取json数据

2. 本地装载jqgrid数据

$("#grid").jqGrid({

datatype: "local",

data : mydata,

colNames: ["ID", "用户名", "上次登录时间", "状态", "操作"],

colModel: [

{ name: "ID", index: "ID",  hidden: true, align: "center" },

{ name: "username", index: "username", width: 180, align:"center"},

{ name: "loginTime", index: "loginTime", width: 300, align:"center" },

{ name: "state", index: "state", width: 180, align:"center" },

{ name: "cz", index: "cz", width: 360, align:"center" }

],

onSelectRow: function (i, selected) {

},

gridComplete: function(){

var ids = jQuery("#grid").jqGrid('getDataIDs');

for(var i in ids){

var cl = ids[i];

a = "";

//         se = "";

jQuery("#grid").jqGrid('setRowData',ids[i],{cz:a});

}

},

height: 300,

//         altRows:true,

// pgbuttons: true,

// pginput:true,

//autowidth:true,

//         pager: "#pager",

//         rowNum: 10,

//         multiselect: true,

//         prmNames: { rows: "pageSize", page: "page" },

//         rowList: [10, 20, 30],

//         viewrecoders: true,

caption: "系统用户信息"

});

3. action部分代码

List xtusers = (List)loginInfoDao.findByHql(" from Xtuser xtuser", null, 0, 0);

//将List转化为JSON

JSONArray json=JSONArray.fromObject(xtusers);

//设置编码,防止乱码

response.setCharacterEncoding("utf-8");

PrintWriter out;

try {

out = response.getWriter();

out.write(json.toString());

} catch (IOException ex) {

ex.printStackTrace();

}

附：本地装载数据后实现分页效果(这里无需显示总条数，适合于我。)

height: 'auto' ,

pager: "#pager",

rowNum: 10,

prmNames: { rows: "pageSize", page: "page" },

rowList: [10, 20, 30],

勿忘显示分页的div：

注意：从后台返回的json数据中如果有id，则将会覆盖jqgrid每行数据的id：

建议，自定义类中不要出现id属性.

转载本文请联系原作者获取授权，同时请注明本文来自程冬科学网博客。

收藏

分享

分享到: