layui数据表格搜索php代码,layui实现显⽰数据表格和搜索功能
⽰例
本⽂实例讲述了layui实现显⽰数据表格和搜索功能。分享给⼤家供⼤家参考，具体如下：
搜索
layui.use('table', function(){
var table = layui.table;
elem: '#test'
,url:'/getdata.php'
,cellMinWidth: 80 //全局定义常规单元格的最⼩宽度，layui 2.2.1 新增
,page: { //⽀持传⼊ laypage 组件的所有参数(某些参数除外，如：jump/elem) - 详见⽂档
layout: ['limit', 'count', 'prev', 'page', 'next', 'skip'] //⾃定义分页布局
//,curr: 5 //设定初始在第 5 页
,groups: 1 //只显⽰ 1 个连续页码
,first: false //不显⽰⾸页
,last: false //不显⽰尾页
}
,cols: [[
{field:'id', width:80, title: 'ID', sort: true}
,{field:'columnname', width:80, title: '字段名'}
,{field:'descriptionCN', width:80, title: '中⽂描述', sort: true}
,{field:'name', width:80, title: '名称'}
,
{field:'description_table', title: '表描述', width: '30%', minWidth: 100} //minWidth：局部定义当前单元格的最⼩宽度，layui 2.2.1 新增
,{field:'description', title: '字段类型', sort: true}
表格网站php源码,{field:'primaryKey', title: '主键', sort: true}
,{field:'class', width:137, title: '分类', sort: true}
]]
});
var $ = layui.$, active = {
reload: function(){
var demoReload = $('#demoReload');
//执⾏重载
page: {
curr: 1 //重新从第 1 页开始
}
,where: {
keyword: demoReload.val()
}
});
}
};
$('#btn .layui-btn').on('click', function(){
var type = $(this).data('type');
active[type] ? active[type].call(this) : '';
});
});
引⽤样式和js，这是必须的。
后台返回数据格式
{
"code": 0,
"msg": "",
"count": 4,
"data:{}
}
希望本⽂所述对⼤家基于layui框架的程序设计有所帮助。

版权声明：本站内容均来自互联网，仅供演示用，请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198，我们将在24小时内删除。