Layui分页功能的开启

Layui分页功能不仅可以异步分页,也可作为页面刷新式分页,并且外观简洁,调用简单,还可以省写很多代码。
在这里插入图片描述

 tabVIP = layuiTable.render({
    url: '',
    cols: [[ ]],
    page: {
        limit: 10,//每页显示的条数
        limits: [5, 10, 15, 20, 25, 30, 35, 40, 45, 50],//每页条数的选择项
    },
});

控制器部分:
LayuiTablePage是我创的一个实体类,里面封装了layui table分页组件。

1、 int totalRow = listvip.Count();计算查询的数据的条数

2、提取分页数据,GetStartIndex和limit是我在layui table分页组件LayuiTablePage里写封装的两个方法,分别表示的是分页开始的序号和每页数据的条数,skip跳过序列中指定的数据的条数,返回查询的分页开始的序号(比如跳过10条,分页开始的序号就从11开始);Take从序列的开头返回数据limit对应的条数。
3、实例化layuiTableData ,把上面totalRow计算的数据总条数、dbvip提取的数据赋值给layuiTableData。

public ActionResult selectVIP(LayuiTablePage layuiTablePage) {
   List<vipVo> listvip = (连表 select new vipVo{赋值}).ToList();
    
    int totalRow = listvip.Count();
    List<vipVo> dbvip = listvip
         .Skip(layuiTablePage.GetStartIndex())
         .Take(layuiTablePage.limit)
         .ToList();

    LayuiTableData<vipVo> layuiTableData = new LayuiTableData<vipVo>();
    layuiTableData.count = totalRow;
    layuiTableData.data = dbvip;

    return Json(layuiTableData, JsonRequestBehavior.AllowGet);
}

实体类部分:

 namespace SYTFZ.EntityClass{
    //layui table组件分页请求数据封装
    public class LayuiTablePage
        //page 代表当前页码
        public int page { get; set; }
        //limit 代表每页数据量
        public int limit { get; set; }
        //分页开始序号
        public int GetStartIndex() {
            return (page - 1) * limit;//第一个(n-1)*10
        }
        //分页结束序号
        public int GetEndIndex() {
            return page * limit - 1;//最后一个(n*10)-1
        }
    }
}
  • 0
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值