记录项目中用的laypage分页代码

低级知识传播者 低级知识传播者     2022-08-25     542

关键词:

最终才觉得,好记性不如烂笔头,毕竟已经不是刚毕业时候的巅峰了,精力有所下降,很多时候记不住东西。

 

参考url:http://www.layui.com/laypage/

直接上代码了

<script src="/assets/js/laypage/laypage.js"></script>

进入页面时,默认加载第一页;定时器每隔60秒取新数据:

    $(document).ready(function () {
        initPaganation();
        setInterval(function() {
            initPaganation();
    }, 60000);
    });

定义全局变量,保存当前页码:

    var pageConf = {
        currentPage: 1,
        pageSize: 10
    };
    function initPaganation() {
        var filter = getQueryAccount();

        var tableForSubTraderSearchArrays = $("#tableForSubTraderSearch input");

        var filter_stockCode = tableForSubTraderSearchArrays.eq(0).val();
        $.ajax({
            type: "POST",
            dataType: "json",
            url: "/*.do",
            data: {
                currentPage: pageConf.currentPage,
                pageSize: pageConf.pageSize,
                filter_subAccountNo: filter.checkedSubAccountId,
                filter_stockCode: filter_stockCode,
                isCalcSubTraders: filter.isCalcSubTraders
            },
            success: function (data) {
                hideLoading();
                if (data.state == 2) {
                    return;
                }

                var totalSize = data.size;
                var totalPage;
                if (totalSize % pageConf.pageSize == 0) {
                    totalPage = totalSize / pageConf.pageSize;
                } else {
                    totalPage = totalSize / pageConf.pageSize + 1;
                }
                laypage({
                    cont: $("#paganation"), //容器。值支持id名、原生dom对象,jquery对象,
                    pages: totalPage, //总页数
                    curr:pageConf.currentPage,//当跳转到其他页后,全局变量被修改,这边就能根据之前的页码保证刷新后依然还是之前的那一页;比如刷新前停在第二页,那么刷新后仍能保持在第二页
                    skip: true, //是否开启跳页
                    skin: ‘#AF0000‘,
                    groups: 5, //连续显示分页数
                    jump: function (obj, first) { //触发分页后的回调
                        if (!first) { //点击跳页触发函数自身,并传递当前页:obj.curr
                            pageConf.currentPage = obj.curr;
//                            debugger
                            searchList(pageConf.currentPage, pageConf.pageSize);
                        }
                    }
                });
                responseHandle(data);
            }

        });
    }
    function searchList(currentPage, pageSize) {
//        showLoading();
        var filter = getQueryAccount();
        var arrays = $("#tableForSubTraderSearch input");

        var filter_stockCode = arrays.eq(0).val();
        var filter_deadlineStartTime = arrays.eq(1).val();
        var filter_deadlineEndTime = arrays.eq(2).val();
        $.ajax({
            type: "POST",
            dataType: "json",
            url: "/*.do",//此处的请求路径和上面的是一样的
            data: {
                currentPage: currentPage,
                pageSize: pageSize,
                filter_subAccountNo: filter.checkedSubAccountId,
                filter_stockCode: filter_stockCode,
                isCalcSubTraders: filter.isCalcSubTraders
            },
            success: responseHandle
        });

    }
    function responseHandle(data) {
        if (data.state != 0) {
            $(".s-tab-table  tr:not(:first)").html("");
            return;
        }
    //process data
}

 

拿来主义:laypage分页插件的使用(代码片段)

  布衣之谈  所谓插件,大概就是项目中可插可拔的比较小功能化的组件;这些功能组件若能力可及,自己也可以完成——也即自己造轮子,但翻看各种技术社区,相关领域的神人们往往会有更好的实现方案贡献出来... 查看详情

laypage分页插件的使用

laypage是用于分页的插件,该插件通过js请求分页数据1.载入js文件<scripttype="text/javascript"src="__STATIC__/hadmin/lib/laypage/1.2/laypage.js"></script>2.在页面中显示分页信息的地方插入标记<divid="laypage"></div>3.添加js & 查看详情

关于layui.laypage.render刷新首页没有分页问题

前言:  最近写项目遇到一个问题,就是使用vue里的layui.laypage.render分页时,刷新首页会只有一页,但后台传来的数据是有50多页的,所有的数据也都一一对应,调了好久debug,终于发现了一个地方:layui.laypage.render的elem有点不... 查看详情

laypage分页

1、分页laypage({cont:$("#page"),//容器,仅支持id名原生DOM对象,jquery对象pages:10,//总页数skip:true,//是否开启跳页groups:5,//连续显示分页数first:1,//首页last:10,//尾页skin:‘#fff‘,//皮肤curr:2,//当前页jump:function(obj,first){//触发分页后的回调//触... 查看详情

layui独立组件layer-laydate-laypage项目实践用法

layUI官网:http://www.layui.com/有以下四个独立组件(可单独使用):弹出层组件layer链接:http://layer.layui.com/日期组件laydate链接:https://www.layui.com/laydate/分页组件laypage链接:https://www.layui.com/laypage/轻量的JavaScript模板引擎laytpl链接:... 查看详情

laypage分页源码

layui.use([‘laypage‘, ‘layer‘], function(){    var laypage = layui.laypage        ,layer = layui.layer;&n 查看详情

laravel5.1与laypage结合进行分页

路由Route::match(array(‘get‘,‘post‘),‘/orm‘,‘[email protected]‘);控制器<?phpnamespaceAppHttpControllers;useIlluminateHttpRequest;useAppHttpRequests;useAppUser;//user表的模型useAppPhone;//phone表 查看详情

在springboot中用springaop实现日志记录功能

...需要在一个SpringBoot的项目中的每个controller加入一个日志记录,记录关于请求的一些信息。代码类似于:  logger.info(request.getRequestUrl());之类的。代码不难,但由于Controller的数量不少,干起来也是体力活。所以想到了用SpringAOP来... 查看详情

解决pagehelper的pagenum失效问题(代码片段)

...bits的PageHelper插件,在测试时发现分页失效了,特记录下此过程。问题描述:PageHelper的分页失效功能描述    SpringBoot(version2.x),实现按照条件分页查询用户信息代码实现项目依赖pom.xml<dependency><groupId>com.github... 查看详情

解决pagehelper的pagenum失效问题(代码片段)

...bits的PageHelper插件,在测试时发现分页失效了,特记录下此过程。问题描述:PageHelper的分页失效功能描述    SpringBoot(version2.x),实现按照条件分页查询用户信息代码实现项目依赖pom.xml<dependency><groupId>com.github... 查看详情

项目代码设计规范总结之分页查询

...接口(interface),其中包含的抽象方法有:获取总页数总记录数每页记录数当前页号其他...再写一个简单分页类实现分页接口,且有扩展方法,比如:检查页码,判断当前页是否为null或者小于1,如果满足其一,返回为页码1,否... 查看详情

分页代码

做项目的过程中用到了分页的功能,其中初次使用的时候使用的是网上的一个方法,虽然使用起来挺方便,但是不清楚其中的逻辑实现,于是就自己写了一个,其中可以在返回结果集中获得分页结果中的当前页,下一页,上一页... 查看详情

如何用把arraylist中的结果在jsp页面中用分页显示?java+jsp语言

...的越简单越好,不用strus,越简单越好,最好把表格每两个记录设置不同的颜色,有追加分数。在线等!我靠!假分页有个屁用。ie扛不住那么多数据的。这样的思路好点:1.提交差查询关键字,这里面就直接包含查询第几页2.查询... 查看详情

tp3.23与laypage结合进行分页增删改查

控制器<?phpnamespaceHomeController;useThinkController;classIndexControllerextendsController{ /** *@brief查询 ****/publicfunctionindex(){ $choose=I(‘choose‘,‘-6‘); $c[‘easy_hard‘]=$choose; $type=I(‘ty 查看详情

如何通过js获取layui-laypage

参考技术A本文实例为大家分享了laypage前端分页插件,ajax异步分页,获取json数据实现无刷新分页,供大家参考,具体内容如下:functionGetList(pageIndex)var_this=""varclone_this="";_this=$(".BindDataList");//数据列表容器... 查看详情

layui数据表格分页加载动画,自己定义加载动画,"加载中..."(代码片段)

记录思路,仅供参考在表格渲染完成后,在done回调函数中给分页动态加点击事件,关闭"加载中..."动画也是在done回调函数中关闭这是我实现的思路,记录给大家参考.,done:function(res,curr,count)//添加分页加载动画的函数$(‘.layui-laypage>a... 查看详情

黑马瑞吉外卖——

...结,对项目中的难点、不熟悉内容、项目亮点以及bug进行记录与分享。以及项目中用到的设计思想进行总结黑马瑞吉外卖项目部分知识总结,对项目中的难点、不熟悉内容、项目亮点以及bug进行记录与分享。以及项目中用到的设... 查看详情

wpf项目学习.三

工具代码记录版权声明:本文为博主初学经验,未经博主允许不得转载。一、前言   记录在学习与制作WPF过程中遇到的解决方案。  分页控件的制作,邮件发送,日志代码,excel导入导出等代码的实现过程; 二、配... 查看详情