最近用到了jqgrid知识,发现这个东东确实很不错,表格界面很专业。
首先贴上 JQGrid demo的连接 :http://www.trirand.com/blog/jqgrid/jqgrid.html
jqgrid的框架页面:
<script>
jQuery("#tb_function").jqGrid({
url:'functioninfo_json.jsp',
datatype: "json",
colNames:['functionId', 'functionName', 'URL','type','typeId','修改', '删除'],
colModel:[
{name:'functionId',index:'functionId', width:100,align:"center",sortable:false},
{name:'functionName',index:'functionName', width:250,align:"center",sortable:false},
{name:'URL',index:'URL', width:400,align:"center",sortable:false},
{name:'type',index:'type', width:80, align:"center",sortable:false},
{name:'typeId',index:'typeId', width:80, align:"center",sortable:false},
{name:'modify',index:'modify', width:80, align:"center",sortable:false},
{name:'delete',index:'delete', width:80, align:"center",sortable:false}
],
height:400,
rowNum:20,
rowList:[10,20,30],
pager: '#pager2',
sortname: 'functionId',
viewrecords: true,
sortorder: "desc", //降序排序
loadonce: true, //表格页面点击前翻或后退自动翻页
caption:"Function信息管理",
});
jQuery("#tb_function").jqGrid('navGrid','#pager2',{edit:false,add:false,del:false,autowidth:true});
</script>
生成jqgrid的json数据(另外一个页面):
String pageNow = request.getParameter("page");
if(rowsLimit==null)
{
rowsLimit="10";
}
JQGridUtil t = new JQGridUtil();
if(null==pageNow)
pageNow="1";
int nPage = 1;
nPage = Integer.parseInt(pageNow);
int total = 1;
String selSql = "SELECT function,functionName,uri,type,typeID FROM functionsinfo ";
String[][] data = con.query(selSql);
int records = data.length;
total = records/Integer.parseInt(rowsLimit)+1;
String[][] arryFun =data;
for(int i=0;i<data.length;i++)
{
arryFun[i] = new String[] { data[i][0], data[i][1], data[i][2], data[i][3], data[i][4],
"<a href='functioninfo_modify.jsp?functionID="+ data[i][0] +"' title='修改' >修改</a>",
"<a href='functioninfo.jsp?action=del&id="+data[i][0] +"' title='删除' >删除</a>"};
}
//行数据
List<Map> rows = new ArrayList<Map>();
for(String[] axx : arryFun){
Map map = new HashMap();
map.put("id", "1");
map.put("cell", axx);
rows.add(map);
}
//rows
GridPager<Map> gridPager = new GridPager<Map>( nPage, total, records, rows);
t.toJson(gridPager, response);