jqGird 学习小结

最新推荐文章于 2022-08-30 09:44:13 发布

有酒有故事

最新推荐文章于 2022-08-30 09:44:13 发布

阅读量243

点赞数 1

分类专栏： java

本文链接：https://blog.csdn.net/sunzhenglin2016/article/details/78683728

版权

java 专栏收录该内容

49 篇文章 0 订阅

订阅专栏

建立返回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>

有酒有故事

关注

1
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
jqGird 学习小结

建立返回jsp的modelpublic class BackListModel { public BackListModel(int code, Object data, String msg, int page, int total, int records) { this.code = code; this.msg = msg; thi
复制链接

扫一扫