jqGird 学习小结

来源：互联网发布：阿里云虚拟主机登录编辑：程序博客网时间：2024/06/05 21:54

建立返回jsp的model

public class BackListModel   {    public BackListModel(int code, Object data, String msg, int page, int total, int records) {        this.code = code;        this.msg = msg;        this.data = data;        this.page = page;        this.total = total;        this.records = records;    }    private int code;    private  String msg;    private  Object data;    // 下面的三个参数参数名很重要 不要错。    private int page;    private int total;    private int records;    }

   @RequestMapping(value = "show" )    public void show( int page, int rows, HttpServletRequest request, HttpServletResponse response) {        /*page 当前页码  rows 每页几个  这个是页面JQGird传进来的*/        String msg = "";        int code  = 0;        List list = userService.findAll((page-1)*rows,rows);        code = 1;        int records =userService.findAllCount();        int total = (int) Math.ceil(records*1.0/rows);        /* total总页数  records 记录总个数*/        String res =  JSONObject.toJSON(new BackListModel(code,list,msg,page,total,records)).toString();        response.setContentType("application/json;charset=utf-8");        try {            response.getWriter().write(res);        } catch (IOException e) {            e.printStackTrace();        }    }

jsp：

 $(function() {            init();            $("#list").jqGrid('navGrid', '#pager',  { edit: false, add: false, del: false, search:false });        });        function  init() {        $("#list").jqGrid({            jsonReader: {              root:"data",//解析model的字段              repeatitems : false            },            url : '${ctx}/userApi/show.do',            datatype : "json",            colNames : [  'userid','useraccount', 'userpassword','action' ],            colModel : [                {name : 'userInfoId',width : 90,sortable:false,align : 'center'},                {name : 'userInfoAccount',width : 90,sortable:false,align : 'center'},                {name : 'userInfoPwd',width:90,sortable:false,align :'center'},                {name : 'userInfoId' , width : 40,sortable:false,align : 'center',formatter : function (value,options,row) {                    var html = "";                    html += '<a onclick="del(\''+value+'\')" style="cursor: pointer;color:blue">删除</a>';                    return html;                }}            ],            rowNum : 5,//初始化每页几个            rowList : [ 5, 10, 15 ],            width :  $(window).width()-80,            height : $(window).height()-300,            pager : '#pager',//页脚            page:1,//初始化第几页            mtype : "post",            viewrecords : true,            caption : "JSON Example"//表格的标题名字        });        }        function del(value){            $.ajax({                type: "POST",                url: '${ctx }/userApi/delete.do',                data: {"userid":value},                dataType: 'json',                success: function (data) {                    if (1 == data.code) {                    }else{                        layer.msg(data.msg);                    }                }            });        }    </script></head><body><h1> user list</h1><table id="list"></table><div id="pager"></div></body>

阅读全文

0 0