easyui datagrid分页代码

   最近在用easyui插件想做个分页效果,于是在网上找了好几天,可能是架构的问题,没有找到哪篇文章能照抄过来就能用的,当时那个头大啊,现在做好了,整理出来与大家分享。其中黑体为重点,其它的不是每个人都这么写的,不需要特别关注。

//获取列名、设置分页
function loadGridClomns() {
    var cols = $.data(document.body, "selectcols");
    postAjax("Report", "CreateGridCol", "&selectcols=" + cols, function (json) {
        if (!json.iserror) {
            $("#grid").datagrid({
                singleSelect: true,
                rownumbers: true,
              pagination: true,//设置分页
              pageSize: 15,//设定每页显示15条数据
              pageList: [10, 15, 20, 25, 30],
                frozenColumns: [json.frozenColumns], //后台json构造的动态列,需指定宽度
                columns: [json.columns1, json.columns2]  //后台自动获取的列名
            });
        }
    });
}


 //查询
 $("#getprefrominfo").click(function () {
        var cols = $.data(document.body, "selectcols");
        if (cols == null) {
            AlertMsg("请选择列!");
            return;
        }
        else {
            $("#grid").datagrid("loading");
            var index = 0; //0为查询
            var qp = {
                cols: cols,
                sortway: $.data(document.body, "sortway"),
                index: index
            };
            $("#result").empty();
            $("#grid").datagrid({
                queryParams: qp,      //datagrid中自带的传值函数
                //这边可以不用 queryParams传值,可以写成:
                // url: '/report/PreformDrawInfo_Get?_=' + radomnum(1000)+data,
                //其中data为字符串类型的数据
                //但是在IE下不用queryParams的话,数据中出现中文字符或出现乱码

                url: '/report/PreformDrawInfo_Get?_=' + radomnum(1000),
                onRowContextMenu: function (e, rowIndex, rowData) {   //右键菜单的触发事件
                    $.data(document.body, "selectupdaterodno", rowData['入库棒号']); //将右键选中的数据放在数据缓存中
                    $('#menu').menu('show', {
                        left: e.pageX,    //右键菜单坐标
                        top: e.pageY
                    });
                    e.preventDefault();//阻止浏览器弹出自带的右键菜单
                }
            });
        }
    });

//只要代码写的没问题,easyui下面的分页插件中,比如选择每页显示多少行和上一页、下一页事件是自动触发的。
//page和rows也是esyui每次自动传到后台的,不需要自己手写

//如:
var index = Convert.ToInt32(Request["index"]);
var page = Convert.ToInt32(Request["page"]);
var rows = Convert.ToInt32(Request["rows"]);

//最重要的是在后台取数据放在json中要添加个参数total来存放数据的总行数,如果没有这个参数则不能分页
比如:json.Data = new { rows = common.EasyJson(dt), total = totalrows };

  • 1
    点赞
  • 7
    收藏
    觉得还不错? 一键收藏
  • 1
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值