00002-layui 右侧呼出页面,PopupLayer
我这里的功能是弹出 右侧搜索 的页面:
top.layui.admin.popupRight({
id: 'LAY_business_PopupLayer'
,area: '350px'
,success: function(layero,index){
var sexArr = top.layui.dict.options("sex");
var statusArr = top.layui.dict.options("status");
top.layui.view(this.id).render('business/businessUserSearch',$.extend(search_field,{
sexArr:sexArr,
statusArr:statusArr
})).done(
function () {
top.layui.form.render();
}
);
}
});
重点是: top.layui.admin.popupRight
而不是:admin.popupRight
同时:PopupLayer 的内容是模板页面,打开代码是:
top.layui.view(this.id).render('business/businessUserSearch');
若有第二个参数,则为传到 businessUserSearch.html模板页的参数。
这里,business/businessUserSearch, 相对目录默认是: /layuiadmin/tpl/ , 且页面默认为html
businessUserSearch.html 代码为:
<script type="text/html" template id="TPL_businessUser">
<div class="layui-form" style="padding-top:20px;padding-right:10px;height: 90%;" id="businessUserSearch">
<div class="layui-form-item">
<label class="layui-form-label">用户帐号</label>
<div class="layui-input-block">
<input class="layui-input" name="userName" value="{{d.params.userName}}" autocomplete="off">
</div>
</div>
<div class="layui-form-item">
<label class="layui-form-label">姓名</label>
<div class="layui-input-block">
<input class="layui-input" name="name" value="{{d.params.name}}" autocomplete="off">
</div>
</div>
<div class="layui-form-item">
<label class="layui-form-label">部门</label>
<div class="layui-input-block">
<input class="layui-input" name="department" value="{{d.params.department}}" autocomplete="off">
</div>
</div>
<div class="layui-form-item">
<label class="layui-form-label">角色</label>
<div class="layui-input-block">
<input class="layui-input" name="role" value="{{d.params.role}}" autocomplete="off">
</div>
</div>
<div class="layui-form-item">
<label class="layui-form-label">职位信息</label>
<div class="layui-input-block">
<input class="layui-input" name="position" value="{{d.params.position}}" autocomplete="off">
</div>
</div>
<div class="layui-form-item">
<label class="layui-form-label">手机</label>
<div class="layui-input-block">
<input class="layui-input" name="tel" value="{{d.params.tel}}" autocomplete="off">
</div>
</div>
<div class="layui-form-item">
<label class="layui-form-label">性别</label>
<div class="layui-input-block">
<select name="sex" id="sex" >
<option value="">请选择</option>
{{#
layui.each(d.params.sexArr, function(index, item){
}}
<option value="{{item[0]}}" {{d.params.sex==item[0]?'selected':''}}>{{item[1]}}</option>
{{# }) }}
</select>
</div>
</div>
<div class="layui-form-item">
<label class="layui-form-label">状态</label>
<div class="layui-input-block">
<select name="status" id="status" >
<option value="">请选择</option>
{{#
layui.each(d.params.statusArr, function(index, item){
}}
<option value="{{item[0]}}" {{d.params.status==item[0]?'selected':''}}>{{item[1]}}</option>
{{# }) }}
</select>
</div>
</div>
<div class="layui-form-item" >
<span class="layui-form-label"></span>
<div class="layui-input-block" style="margin-right:0">
<button class="layui-btn" lay-submit lay-filter="businessUser-list-search" id="businessUser-list-search">
<i class="layui-icon layui-icon-search layuiadmin-button-btn"></i>
</button>
<button class="layui-btn layui-btn-normal" lay-submit lay-filter="businessUser-list-refresh">
<i class="layui-icon layui-icon-refresh-3 layuiadmin-button-btn"></i>
</button>
</div>
</div>
</div>
</script>
{{d.params.name}} 是父页面传过来的参数。
父页面监听按钮事件:
top.layui.form.on('submit(businessUser-list-search)', function(data){
var field = data.field;
table.reload('businessUserListTable', {
where: field
});
search_field = field;
top.layui.layer.close(top.layui.admin.popup.index);
});
top.layui.form.on('submit(businessUser-list-refresh)', function(data){
top.layui.$(':input').not(':button, :submit, :reset').val('').removeAttr('selected').removeAttr('checked')
search_field = {};
top.layui.form.render();
table.reload('businessUserListTable', {
where: null
});
});
页面重新渲染、关闭页面、监听事件, 都要 加 :top.layui.
00002-layui 右侧呼出页面,PopupLayer的更多相关文章
- layui(弹出层)
首先引入文件 layui.css jquery.min.js layui.js 弹出层 data-method 后面的属性控制是什么弹窗,在js中写方法 <div class="sit ...
- 假如现在有一堆长度大于3小于9的电话号码,用座机呼叫,如果出现这样的号码【123和12345】那么12345将永远不会被拨出,因为拨到123的时候电话已经呼出了,试写一个函数输出所有不能被呼出的电话号码(java实现)
解题: 假如现在有一堆长度大于3小于9的电话号码,用座机呼叫,如果出现这样的号码[123和12345]那么12345将永远不会被拨出,因为拨到123的时候电话已经呼出了,试写一个函数输出所有不能被呼出 ...
- 技术解析:锁屏绕过,三星Galaxy系列手机也能“被”呼出电话
近期,由两位安全研究人员,Roberto Paleari及Aristide Fattori,发布了关于三星Galaxy手机设备安全漏洞的技术细节.据称,Galaxy手机可在锁屏状态下被未授权的第三方人 ...
- asterisk中使用dahdi通道呼出的注意事项
asterisk中使用dahdi通道呼出的注意事项 在使用dahdi通道呼出的时候,可以在Dial中对呼出所使用的通道进行指定选择.以下面的例子来说明: 场景说明:数字板卡单E1,使用pri信令,1- ...
- iOS中如何呼出另一个应用
我们经常会遇到在一个应用里面呼出另一个应用的需求,比如在文档里面点击地址,调用safari来打开网页:比如在文件浏览器里面点击某种文件,自动激活一个应用来打开文件. iOS里面对于这样的需求使用URL ...
- C#からネイティブDLLを呼び出す場合のVSからのデバッグのジレンマを解決する
「C#を使う最大のメリットって.やっぱり.Visual Studioですよね!」って自信を持って言いたいですね. という心境ではあるんですが.私の仕事はどっちかというとC++よりなので.どうしても.D ...
- gentoo emacs 中文输入法 呼出
最近在另外一台电脑上面安装 gentoo和 emacs,但是碰到奇怪的问题,在旧电脑上面,可以使用 ctrl + space 呼出输入法,而新电脑只能触发 复制功能. 经过在网上查找和两台电脑之间的对 ...
- layui关闭弹出层
layui关闭弹出层,今天我在vscode中使用p parent.layer.closeAll()发现没效果 换成layer.closeAll()就解决了这个问题. 由此我觉得关闭layui关闭弹出层 ...
- 安卓手机H5底部fix定位,呼出键盘底部会上浮解决办法
<script type="text/javascript">var windowInnerHeight = window.innerHeight; //获取当前浏览器 ...
随机推荐
- Django编写自定义manage.py 命令
官网文档地址:编写自定义 django-admin 命令 金句: 你所浪费的今天,正是昨天死的人所期待的明天. 开篇话: python manage.py <command> 的命令我们用 ...
- synchronized 代码块怎么用
加不加 synchronized 有什么区别? synchronized 作为悲观锁,锁住了什么? 之前 2 篇文章我们已经知道 synchronized 的使用方法以及锁的内容(实例对象和Class ...
- tp5.0--多个条件查询全部数据
用where来查询的话(非主键): 查找:
- koa+mysql实现增删改查-全栈之路(001)
Date: 2020-4-23 以前很少写文章,从今天开始我要挑战一下自己,连续输出100篇技术类文章.这100篇文章我尽量以实战案例为主. 如果你觉得本文还不错,记得关注或者给个 star,你们的赞 ...
- HDU 5954 Do Not Pour Out
#include<bits/stdc++.h> using namespace std; #define rep(i,a,b) for(int i=a;i<=b;++i) #defi ...
- 什么是最好的在线UML软件工具?
在线UML软件工具允许您创建UML图表,而UML绘图工具可帮助维护您的建模工件并促进不同图表中元素的可重用性.一些UML建模工具还提供复杂的建模功能,例如模型转换,报告,代码工程等. 如果您正在寻找U ...
- 最大公约数gcd、最小公倍数lcm
最大公约数(辗转相除法) 循环: int gcd(int a,int b) { int r; ) { r=b%a; b=a; a=r; } return b; } 递归: int gcd(int a, ...
- #Week4 Logistic Regression
一.Classification 主要讨论二元分类. 线性回归处理分类问题显然不靠谱,所以采用逻辑回归. 二.Hypothesis Representation 假设函数变为\(h_\theta(x) ...
- DFS--POJ 1190 生日蛋糕
Description 7月17日是Mr.W的生日,ACM-THU为此要制作一个体积为Nπ的M层生日蛋糕,每层都是一个圆柱体. 设从下往上数第i(1 <= i <= M)层蛋糕是半径为Ri ...
- 曹工谈并发:Synchronized升级为重量级锁后,靠什么 API 来阻塞自己
背景 因为想知道java中的关键字,对应的操作系统级别的api是啥,本来打算整理几个我知道的出来,但是,尴尬的是,我发现java里最重要的synchronized关键字,我就不知道它对应的api是什么 ...