thinkphp5.1与layui table表格使用
第1部分:layui 的 html代码,
即第2部分 thinkphp 控制器方法 index/Dataz/returnShowUser 的view页面
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>table模块快速使用</title>
<link rel="stylesheet" href="/layuiadmin/layui/css/layui.css" media="all">
</head>
<body> <table id="demo" lay-filter="test"></table> <script src="/layuiadmin/layui/layui.js"></script>
<script>
layui.use('table', function(){
var table = layui.table; //第一个实例
table.render({
elem: '#demo'
,height: 312
,url: '{:url('index/Dataz/index')}' //数据接口
,page: true //开启分页
,limit:6
,cellMinWidth: 30
,cols: [[ //表头
{field: 'id', title: 'ID', sort: true, fixed: 'left'}
,{field: 'username', title: '用户名'}
,{field: 'create_time', title: '创建时间', sort: true}
,{field: 'email', title: '邮箱'}
,{field: 'phone', title: '手机'}
,{field: 'face_img', title: '头像地址',}
,{field: 'userip', title: 'IP', sort: true}
,{field: 'status', title: '状态', }
,{field: 'update_time', title: '更新时间', sort: true}
]]
}); });
</script>
</body>
</html>
第2部分:thinkphp 控制器 方法
<?php
namespace app\index\controller;
use think\Controller;
use \app\common\model\Useradmin as Useradmin; class Dataz extends Controller
{
public function index()
{ //获得数据总数
$useradmin = new Useradmin();
$user = $useradmin->order('id','asc')->select();
$allcount = count($user); //获取传递的分页参数
$page=request()->param('page');
$limit=request()->param('limit');
$start=$limit*($page-1); //分页查询
$userpage = $useradmin->order('id','asc')->limit($start,$limit)->select();
$res = [
'code'=>0,
'msg'=>'返回成功',
'count'=>$allcount,
'data'=>$userpage
];
return json($res);
} public function returnShowUser(){
return view('index');
} }
第3部分:完成预览,访问{:url('index/Dataz/returnShowUser')}
thinkphp5.1与layui table表格使用的更多相关文章
- layui table 表格模板按钮实例
这是个是全部的jsp 页面: <%@page pageEncoding="UTF-8" contentType="text/html; charset=UTF-8& ...
- layui table 表格查询无效问题
[热身话题] 在开发的过程中,大量数据的展示大多采用表格的方式,直观,清晰.在这里,我也使用过一些框架Bootstrap.table ,Dev table ,layui table.本次采用的layu ...
- layui table表格详解
上次做table有些东西 忘记了 这次当作来个分析总结一下 跟大家共同学习 闲话不多说 直接上例子 代码: <form id="form1" runat="s ...
- layui table 表格上添加日期控件
方法一: var tableInit = table.render({ elem: '#tbtxrz' , method: 'post' , data: jsonData , height: &quo ...
- LayUI table表格控件 如何显示 对象中的属性(针对Mybatis的级联查询--一对一情况)
1.entity如下: 2.Mybatis的Mapper.xml文件如下 <resultMap id="BaseResultMapPlus" type="dicIt ...
- layui table表格字段过长,展示不完整时,鼠标放到上面展示完整信息
亲测可以直接用 1.首先每个列都有一个title,里面放入完整信息,然后写一个如下的function, function tdTitle(){ $('th').each(function(index, ...
- layui table表格 表头与内容列错位问题(只有纵向滚动条的情况)
版本2.4.5 问题展示: 存在问题:正好错位一个纵向滚动条的宽度 思路: 仔细观察th元素及th包裹的子元素div 如下图 发现th宽度莫名的就多了5px 我就纳闷了 解决方案:到table.js ...
- 由于ie浏览器ajax缓存 导致layui table表格重载失败的解决办法
where: { time:new Date()//增加一个数据接口的额外参数→时间戳 }
- layui-table-column-select(layui数据表格可搜索下拉框select)
layuiTableColumnSelect 在layui table的基础上对表格列进行扩展:点击单元格显示可搜索下拉列表. 码云地址:https://gitee.com/yangqianlong9 ...
随机推荐
- 【树形DP】BZOJ 1131 Sta
题目内容 给出一个\(N\)个点的树,找出一个点来,以这个点为根的树时,所有点的深度之和最大 输入格式 给出一个数字\(N\),代表有\(N\)个点.\(N \le 1000000\).下面\(N-1 ...
- kafka-manage管理工具
1 github地址 https://github.com/sheepkiller/kafka-manager-docker 2 启动 将参数传递给kafka-manager 对于版本 ...
- ansible2.9.5使用become参数实现sudo功能
一,为什么要使用sudo? 1, 生产环境中,为了安全因素,我们不会直接使用root来登录到server, 确实有需要的情况下,我们再使用sudo切换到root权限. 所以很多ansible的演示直接 ...
- springboot入门系列(四):SpringBoot和Mybatis配置多数据源连接多个数据库
SpringBoot和Mybatis配置多数据源连接多个数据库 目前业界操作数据库的框架一般是 Mybatis,但在很多业务场景下,我们需要在一个工程里配置多个数据源来实现业务逻辑.在SpringBo ...
- kettle学习笔记(三)— 定时任务的脚本执行
kettle-定时任务 Kettle 的定时任务可以用kettle中的job工作来定时转换(缺点窗口不可关闭),同时也可以使用bat脚本来启动kettle的 '.ktr'转换. 注:这里对定时任务的时 ...
- Docker启动Mysql镜像
date: 2020-03-14 17:00:00 updated: 2020-03-14 18:00:00 Docker启动Mysql镜像 管理员权限!!! docker run -p 3306:3 ...
- Netty关闭连接流程分析
在实际场景中,使用Netty4来实现RPC框架,服务端一般会验证协议,最简单的方法的协议探测,判断魔数是否正确.如果服务端无法识别协议会立即抛出异常,并主动关闭连接,此时客户端会收到read信号,在发 ...
- vue watch的用法
1.监听对象需要深度监听 ,如下代码可以监听整个msg对象的变化 watch: { msg: { handler(newValue, oldValue) { console.log(newValue) ...
- H5头部内容
<head> <meta charset="utf-8"> <title>口袋小鼠</title> <meta name=&q ...
- 一起学Vue:CRUD(增删改查)
目标 使用Vue构建一个非常简单CRUD应用程序,以便您更好地了解它的工作方式. 效果页面 比如我们要实现这样列表.新增.编辑三个页面: 列表页面 新增页面 编辑页面 我们把这些用户信息保存到Todo ...