layui配置
layui是一个全局变量,可以在任何地方访问到
layui.config 方法主配置信息(经测试好像不能添加额外属性)
layui.setter读取主配置属性
layui.extend 方法增加主配置模块
layui.use 方法引用
第一个参数(数组)用于加载模块,如果只有一个模块可以直接写字符串;
第二个参数(方法)页面回调,增加页面自定义事件
layui.config({
base: '../layuiadmin/', //静态资源所在路径
}).extend({
index: 'lib/index', //主入口模块
}).use(['index', 'forum', 'table'], function () {
var $ = layui.$
, form = layui.form
, table = layui.table;
});
>>>layui.setter.base
'../layuiadmin/'
一个搜索按钮,一个表格:
<button class="layui-btn layuiadmin-btn-replys" data-type="reload" lay-submit lay-filter="LAY-app-forumreply-search">
<i class="layui-icon layui-icon-search layuiadmin-button-btn"></i>
</button> <table id="LAY-app-forumreply-list" lay-filter="LAY-app-forumreply-list"></table>
元素包含lay-submit,根据lay-filter的值来得到该按钮
//得到元素所在layui-form中的表单数据
form.on('submit(LAY-app-forumreply-search)', function (data) {
//data.field表单中包含name属性的键值对象
var field = data.field; //执行页面中 id="LAY-app-forumreply-list"的重载
table.reload('LAY-app-forumreply-list', {
//where属性可以在异步请求中增加额外的参数
where: field
});
});
加载列表:
table.render({
elem: "#LAY-app-forumreply-list",
url: "/Txooo/Sales/Mch/Product/Ajax/ProductAjax.ajax/GetProductList3",
cols: [[{
//多选框
type: "checkbox",
fixed: "left"
},
{
//可排序的列sort
field: "replytime",
title: "回帖时间",
sort: !0
},
{
//读取模板加载列内容
title: "操作",
width: 150,
align: "center",
fixed: "right",
toolbar: "#table-forum-replys"
}]],
page: 0,
limit: 10,
where: {
pageIndex: 0,
r_state: 5
},
limits: [10, 15, 20, 25, 30],
text: "对不起,加载出现异常!",
response: { dataName: "list" }
})
render 列表渲染
elem 渲染目标id
url 异步加载地址
page 固定读取分页当前页
limit 固定每页条数
limits 可选每页条数
response 请求参数配置{"statusName":"code","statusCode":0,"msgName":"msg","dataName":"data","countName":"count"}
cols 列名与内容设置
- type 内容类型
- fixed 样式左右方向
- field 对应的异步数据字段名称
- title 展示的列名
- sort 可排序字段
- align 字体居中
- toolbar 可操作模板id
- templet 普通模板内容id或html代码
layui配置的更多相关文章
- Springboot+Thymeleaf+layui框架的配置与使用
前言Springboot默认是不支持JSP的,默认使用thymeleaf模板引擎.所以这里介绍一下Springboot使用Thymeleaf的实例以及遇到的问题. 配置与使用1.在applicatio ...
- Layui 上传图片到磁盘上 + Tomcat 配置虚拟路径
Layui 上传图片到磁盘上 + Tomcat 配置虚拟路径 Tomcat 配置虚拟路径 找到 eclipse 中 tomcat 下面的 server.xml 文件,在 Host 标签里面添加 < ...
- layui 各项配置
第一.如何全部选中table中每一条记录 1.首先给table的父类设置一个唯一id *这种方式不推荐,效果比较差,推荐第2种方式 再搜索 alias-table div.layui-table-fi ...
- Layui的一点小理解(上)
首先声明这是个人的一点理解,如有不对之处请指正,以下的例子有在官网上看到的,有的是自己写的.还是老规矩最后会附上官网的,如有不明白之处,请查看文档或留言. 既然说Layui,当然要简单的介绍以下什么是 ...
- 基于layUI实现前端分页功能
一.layUI介绍 Layui 是一款采用自身模块规范编写的国产前端UI框架,遵循原生HTML/CSS/JS的书写与组织形式,门槛极低,拿来即用.内置了一些常用元素和组件的UI框架. 下载地址为htt ...
- LayUI分页,LayUI动态分页,LayUI laypage分页,LayUI laypage刷新当前页
LayUI分页,LayUI动态分页,LayUI laypage分页,LayUI laypage刷新当前页 >>>>>>>>>>>> ...
- layui + jfinal 实现上传下载
1.需要把jfinal的环境配置好 2.导入相关的库文件 layui的库文件 就是这两个文件需要导入到自己的页面 注意:jfinal总会把路径拦截,所以需要静态文件处理.本人不太懂.就网上找了下,说w ...
- .net core页面使用layui的HtmlHelper扩展
Vino.Core.Extensions.Layui 如果您的.net core 2.0项目使用layui来渲染表单,那么您可以尝试使用这个扩展库可以帮你减少代码和工作量. 项目地址:https:// ...
- .net core使用Ku.Core.Extensions.Layui实现layui表单渲染
演示网站地址:http://layui.kulend.com/项目地址:https://github.com/kulend/Ku.Core.Extensions/tree/master/Ku.Core ...
随机推荐
- 学习swift从青铜到王者之Swift控制语句04
1 if语句基本用法 if boolean_expression { /* 如果布尔表达式为真将执行的语句 */ } 如果布尔表达式为 true,则 if 语句内的代码块将被执行.如果布尔表达式为 f ...
- HDU 5280 Senior's Array
Senior's Array Time Limit: 2000/1000 MS (Java/Others) Memory Limit: 65536/65536 K (Java/Others) T ...
- 怎样解读Caffe源代码
怎样解读Caffe源代码 导读 Caffe是如今非常流行的深度学习库,能够提供高效的深度学习训练.该库是用C++编写.能够使用CUDA调用GPU进行加速.可是caffe内置的工具不一定能够满足用户的全 ...
- Manage, Administrate and Monitor GlassFish v3 from Java code usingAMX & JMX
http://kalali.me/manage-administrate-and-monitor-glassfish-v3-from-java-code-using-amx-jmx/ Manage, ...
- Office2010,PPT,EXCEL如何插入日历控件
1 在Office2010中插入其他控件,然后找到日历控件 2 十字架随便在Excel中绘制一下,得到一个日历控件,注意此时还是在设计模式下,在设计模式下日历控件不是正常状态,你还是可以双击这个控 ...
- python05-09
一.lambda表达式 def f1(): return 123 f2 = lambda : 123 def f3 = (a1,a2): return a1+a2 f4 = lambda a1,a2 ...
- php进一法取整、四舍五入取整、忽略小数等的取整数方法大全
PHP取整数函数常用的四种方法,下面收集了四个函数:经常用到取整的函数,今天小小的总结一下!其实很简单,就是几个函数而已--主要是:ceil,floor,round,intval PHP取整数函数常用 ...
- createElement与innerHtml性能比較
js中.动态加入html的方法大致就是两种,一种是document.createElement等方法创建,然后使用Element.appendChild加入,或者是使用Element.innerHTM ...
- @Html.ValidationMessageFor客户端验证
<%=Html.LabelFor(model => model.sUser) %><%=Html.TextBoxFor(model => model.sUser) %&g ...
- 深入分析JavaWeb Item13 -- jsp指令具体解释
一.JSP指令简单介绍 JSP指令(directive)是为JSP引擎而设计的.它们并不直接产生不论什么可见输出,而仅仅是告诉引擎怎样处理JSP页面中的其余部分. 在JSP 2.0规范中共定义了三个指 ...