jqgrid 使用心得

来源:互联网 发布:常用数据结构和算法下 编辑:程序博客网 时间:2024/05/17 09:18

最近用到了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);





原创粉丝点击