<!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"=>"失败"];
}
}
}

效果:

layui 后台分页的更多相关文章

  1. 在layui中,新的页面怎么获取另一个页面传过来的数据,并可以对数据进行判断,layui中的后台分页(table)。

    例如:打开一个新页面的同时,传数据. layer.open({ type: 2, title: '新增项目', shadeClose: false, shade: [0.3], maxmin: tru ...

  2. layui(三)——laypage组件常见用法总结

    laypage 的使用非常简单,指向一个用于存放分页的容器,通过服务端得到一些初始值,即可完成分页渲染.核心方法: laypage.render(options)  来设置基础参数. 一.laypag ...

  3. layui二次封装

    最近一直用layui进行页面的重构,这个框架十分适合我们后台人员开发.简单易用,但是layui本身不支持双向绑定,所以很多情况下,我们在支持动态的控件加载时,需要反复刷新.这里我自己封装了一个comm ...

  4. layui table 表格查询无效问题

    [热身话题] 在开发的过程中,大量数据的展示大多采用表格的方式,直观,清晰.在这里,我也使用过一些框架Bootstrap.table ,Dev table ,layui table.本次采用的layu ...

  5. layui常用方法

    很好用的一个ui组件,弹出,分页等 http://layer.layui.com/ 1 带叉叉的弹窗 layer.open({ type: , title: false, //不显示标题 conten ...

  6. 总结一下项目中遇到的分页问题,使用bootstrap-table来做的后台分页,大家可以借鉴一下 (分页第一篇)

    前台进入bootstrap的js和css文件,我就不多少了,另外要引进bootstrap-table的js和css 废话不多说,直接代码.   框架为ssm,代码很清楚 <div class=& ...

  7. 开源网站.NETMVC+ Layui+SqlSugar+RestSharp

    SugarSite一个前端支持移动端的企业网站,目前只支持了简单功能,后续还会加上论坛等. 源码GIT地址: https://github.com/sunkaixuan/SugarSite 技术介绍 ...

  8. 分页组件 - layui.laypage

    <!doctype html> <html> <head> <meta charset="utf-8"> <title> ...

  9. 日期时间组件 - layui.laydate

    全部参数 一.核心方法:laydate(options); options是一个对象,它包含了以下key: '默认值' { elem: '#id', //需显示日期的元素选择器 event: 'cli ...

随机推荐

  1. Linux系统调优——系统整体运行状态排查(七)

    (1).vmstat vmstat命令是最常见的Linux/Unix监控工具,可以展现给定时间间隔的服务器的整体状态值,包括服务器的CPU使用率,MEM内存使用,VMSwap虚拟内存交换情况,IO读写 ...

  2. 报错:java.lang.ClassNotFoundException: com.mysql.jdbc.exceptions.jdbc4.MySQLSyntaxErrorException

    1.创建mysql_link的时候一定要注意是不是多加了空格: 2.检查Sqoop是否引入了jdbc的jar包.

  3. pycharm远程SSH调用服务器python解释器教程

    该教程主要介绍pycharm远程SSH调用解释器以及建立SFTP文件传输协议: 第一步:建立SSH连接: 第二步:建立SFTP协议: (1)SSH: 配置远程python解释器 这里主要讲的是如何配置 ...

  4. LeetCode_345. Reverse Vowels of a String

    345. Reverse Vowels of a String Easy Write a function that takes a string as input and reverse only ...

  5. jenkins离线安装插件

    2.jenkins离线安装插件 安装插件参照文档: https://blog.csdn.net/russ44/article/details/52266953 插件相关下载地址:http://upda ...

  6. 将自己的项目作为jar包发布到maven中央仓库

    maven版本是3.5.0,jdk是1.8(注意,不是说项目是1.8就行,必须是环境变量里的也是,不能超过1.8,否则一大堆问题,执行mvn前用javac -version看下版本) 一:先在sona ...

  7. LeetCode 206. 反转链表(Reverse Linked List) 16

    206. 反转链表 206. Reverse Linked List 题目描述 反转一个单链表. 每日一算法2019/5/19Day 16LeetCode206. Reverse Linked Lis ...

  8. ABP中的AutoMapper

    在我们的业务中经常需要使用到类型之间的映射,特别是在和前端页面进行交互的时候,我们需要定义各种类型的Dto,并且需要需要这些Dto和数据库中的实体进行映射,对于有些大对象而言,需要赋值太多的属性,这样 ...

  9. C#中的System.Web.HttpUtility.UrlEncode转码问题

    最近需要与JAVA程序对接口,其中遇到的URL转码问题: Java中URL编码所用的 URLEncoder.encode 产生的字符是大写且英文'(',')'是分别转成'%28'和 '%29' 而C# ...

  10. ESP32 - GPIO中断触发与事件回调

    最近为项目增加了GPIO外部触发中断功能,原理是为GPIO32注册了上升沿触发事件,事件触发后,会向RTOS队列写入数据.在RTOS事件中检测到该队列中有新加入的事件,就读出,并执行相应代码. #de ...