zoukankan      html  css  js  c++  java
  • layui 后台分页

    <!DOCTYPE html>
    <html>
    <head>
      <meta charset="utf-8">
      <title>layui</title>
      <meta name="renderer" content="webkit">
      <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
      <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
      <link rel="stylesheet" href="__STATIC__/add/layui/css/layui.css"  media="all">
      <!-- 注意:如果你直接复制所有代码到本地,上述css路径需要改成你本地的 -->
    </head>
    <body>
     
    <table class="layui-hide" id="test"></table>
                  
              
    <script src="__STATIC__/add/layui/layui.js" charset="utf-8"></script>
    <!-- 注意:如果你直接复制所有代码到本地,上述js路径需要改成你本地的 --> 
    
    <script>
    layui.use('table', function(){
      var table = layui.table;
      
      table.render({
        elem: '#test'
        ,url:'{:url("Achievementactivity/fenye")}'
        /*,page: { //支持传入 laypage 组件的所有参数(某些参数除外,如:jump/elem) - 详见文档
          layout: ['limit', 'count', 'prev', 'page', 'next', 'skip'] //自定义分页布局
          //,curr: 5 //设定初始在第 5 页
          ,groups: 1 //只显示 1 个连续页码
          ,first: false //不显示首页
          ,last: false //不显示尾页
        }*/
        ,cols: [[
          {type:'checkbox'}
          ,{field:'id', title: 'ID', sort: true}
          ,{field:'title', title: '标题'}
          ,{field:'status', title: '状态', sort: true}
          ,{field:'start_time', title: '开始时间'}
          ,{field:'end_time', title: '结束时间', minWidth: 150}
          ,{field:'is_check', title: '核算', sort: true}
         
        ]]
        ,page: true
      });
    });
    </script>
    
    </body>
    </html>

    引入layui即可

    PHP:

        //layui分页
        public function layuifenye() {
            return $this->fetch();
        }
    
        public function fenye() {
            $fy = $_GET;
            if(empty($fy)) {
                 $sql = 'select id,title,status,start_time,end_time,is_check from jm_achievement_activity limit 10';
                 $list     = Db::query($sql);
                 if($list) {
    
                    //查找数据总数量
                    $countnum = Db::table('achievement_activity')->field('id,title,status')->count();
    
                    //返回数据 :layui正确的成功状态码应为:"code": 0
                    return ["code"=>"0","msg"=>"","count"=>$countnum,"data"=>$list];
                 
                }else{
                   return ["code"=>"1","msg"=>"失败"];
                }
            }else{
            
                 $page = $fy['page'];
                 $limit = $fy['limit'];
                 $sql = 'select id,title,status,start_time,end_time,is_check from jm_achievement_activity order by id limit '. $page .','. $limit;
                 $list     = Db::query($sql);
                 if($list) {
    
                    //查找数据总数量
                    $countnum = Db::table('achievement_activity')->field('id,title,status')->count();
                    //返回数据 :layui正确的成功状态码应为:"code": 0
                    return ["code"=>"0","msg"=>"","count"=>$countnum,"data"=>$list];
                 
                }else{
    
                   return ["code"=>"1","msg"=>"失败"];
                }
            }
        }

     效果:

  • 相关阅读:
    超出范围样式...
    CSS 滚动条设置
    js 数组全包含
    vue字段为空过滤器
    window.open 打开的新页签会携带sessionStorage中的数据
    ES6的解构赋值与深拷贝和浅拷贝
    vue中怎么处理多个单选框,且单选框互不影响的方案
    h5项目中关于ios手机软键盘导致页面变形的完美解决方案
    vue项目中关于微信分享的坑,以及安卓和ios获取location.href不同的处理
    navicat连接mysql报错1251的解决方法
  • 原文地址:https://www.cnblogs.com/yszr/p/11613289.html
Copyright © 2011-2022 走看看