layer 一些理解

"layui-input-inline"的意思是对于母div的子元素进行水平排列
class=“layui-inline” 可以用来div强制不换行
layui-form-item单独使用这个类会默认该元素独占一行
这是因为layui-input-block这个类是一个表单元素占一行，竖着，以例表的形式排列。然后配合layui-form-item的使用，使这两个元素处在同一行。
但通常来讲，我们不需要这么长的input，我们可以把外面的div的类换成class="layui-input-inline"试试
======================================“”

标签：

fixed 固定列 input 的属性autocomplete 默认为on 其含义代表zd是否让浏览器自动记录之前输入的值很多时候，需要对客户的资料进行保密，防止浏览器软件或者恶意插件获取到可以在input中加入autocomplete="off" 来关闭记录 ` lay-verify="required" 必填项验证字段是否为空 lay-filter 监听 submit 提交按钮

   $('#refuse').on('click',function () {layer.open({type:1,area:['500px','300px'],content:$('#refuseDiv').html(),shadeClose:true,btn:['确认','取消'],title:'审核拒绝',yes:function (index,layero) {//index 为当前页面索引，layero 为当前页面的DOM，所以可以利用下面的方式获取$.ajax({url:'<%=contextPath%>/doctor/refuseApply',type:'post',dataType:'json',contentType:'application/json',data:JSON.stringify({id:$("#userId").val(),
//获取的内容                          reason:$(layero).find('textarea[name=reason]').val(),state:3}),success:function (data) {if (data.code=='200'){layer.msg("审核成功");layer.close(index);var index1 = parent.layer.getFrameIndex(window.name); //先得到当前iframe层的索引parent.layer.close(index1); //再执行关闭}elselayer.msg("审核失败");},error:function (data) {layer.msg("审核失败");}});},cancel:function (index,layero) {layui.layer.close(index);}});});

layui.use([ 'jquery', 'table', 'layer', 'form' ], function() {// 加载layui模块，使用其推荐的【预先加载】方式，详见官网【模块规范】一节var $ = layui.$;var table = layui.table;var layer = layui.layer;var form = layui.form;//显示分组table.render({elem : '#group-tbl',url : basePath + 'modulegroup/getTableData.do',method : 'get',cols : [ [ {field : '_name',title : '模块名称'}, {toolbar : '#group-tbl-toolbar',title : '操作'} ] ],id : 'group-tbl',});//监听行工具栏事件table.on('tool(group-tbl)', function(obj) {// 获取当前行数据和lay-event的值var data = obj.data;var event = obj.event;if (event == "selectGroup") {$('#_moduleGroupId').val(data._id);$('#_moduleGroupName').val(data._name);changeModuleGroup(data._id)layer.close(groupLayer);}})table.render({id : 'module-tbl',elem : '#module-tbl',url : basePath + 'module/getList.do',toolbar : '#module-tbl-toolbar',method : 'get',//page : true, //开启分页cols : [ [ {field : '_name',title : '模块名称',sort : true}, {field : '_classname',title : '模块类名',sort : true}, {field : '_orderId',title : '顺序号',sort : true}, {field : '_issync',title : '同步'}, {field : '_equipment',title : '设备配置',sort : true,templet : '#equipmentTmp'}, {field : '_generate_flag',title : '表生成状态',sort : true,templet : '#generateTmp'}, {field : '_remarks',title : '备注'}, {field : '_inputmen',title : '操作人员'}, {field : '_inputdate',title : '操作时间'}, {toolbar : '#module-rowtbl-toolbar',title : '操作',width : 200} ] ]});//查询监听form.on('submit(module-tbl-search)', function(data) {console.log(data);table.reload('module-tbl', {where : data.field})});//监听头部工具栏事件事件table.on('toolbar(module-tbl)', function(obj) {// 获取当前行数据和lay-event的值var data = obj.data;var event = obj.event;if (event == "addUI") {layer.msg("添加模块...");$('#add-module-form')[0].reset();layer.open({type : 1,title : '添加模块',fixed : true,offset: '100px',skin : 'layui-layer-molv',area : [ '500px' ],content : $('#add-module-layer')});}else if(event == "refresh"){table.reload('module-tbl');}})// 添加用户表单提交form.on('submit(add-module-form-submit)', function(data) {$.ajax({url : basePath + "module/edit.do",type : "POST",data : data.field,dataType : 'json',success : function(result) {if (result.success) {layer.closeAll();layer.msg('添加成功',{offset:"100px"});table.reload('module-tbl');} else {layer.msg(result.msg,{offset:"100px"});}},error : function() {console.log("ajax error");}});return false;});// 监听行工具栏事件：删除用户与更新用户table.on('tool(module-tbl)', function(obj) {var data = obj.data;var event = obj.event;if (event === 'generate') {layer.confirm('确定生成数据表吗？',{offset:"100px"}, function(index) {$.ajax({url : basePath + 'module/generate.do?_id=' + data._id,type : "GET",dataType : 'json',success : function(result) {if (result.success) {layer.msg('操作成功',{offset:"100px"});table.reload('module-tbl');} else {layer.msg(result.msg,{offset:"100px"});}},error : function() {console.log("ajax error");}});layer.close(index);});}//删除操作if (event == 'deleteModule') {layer.confirm('确定删除该数据吗?',{offset:'100px'},function(index) {$.ajax({url : basePath + "module/delete.do?_id=" + data._id,type : 'GET',dataType : 'json',success : function(result) {if (result.success) {layer.msg("操作成功");table.reload('module-tbl')} else {layer.msg(result.msg,{offset:"100px"});}},error : function() {layer.msg("ajax error",{offset:"100px"});}})})}// 更新模块事件if (event === 'updateModule') {form.val('update-module-form', {"_id" : data._id,"_orderId" : data._orderId,"_moduleGroupId" : data._moduleGroupId,"_name" : data._name,"_remarks" : data._remarks,"_isenter" : data._isenter,"_issync" : data._issync,"_classname" : data._classname,"_equipment" : data._equipment,"_moduleGroupName" : data._moduleGroupName});layer.open({type : 1,title : '更新模块',fixed : true,offset: '100px',skin : 'layui-layer-molv',area : [ '500px' ],content : $('#update-module-layer')});form.on('submit(update-module-form-submit)', function(data) {$.ajax({url : basePath + "module/edit.do",type : "GET",data : data.field,dataType : 'json',success : function(result) {if (result.success) {layer.closeAll();layer.msg('更新成功',{offset:"100px"});table.reload('module-tbl');} else {layer.msg(result.msg,{offset:"100px"});}},error : function() {console.log("ajax error",{offset:"100px"});}});return false;});}});
});var groupLayer;
var addModuleLayer;
var editModuleLayer;
function selectModuleGroup() {groupLayer = layer.open({type : 1,offset: '100px',title : '选择模块分组',skin : 'layui-layer-molv',area : [ '300px' ],content : $('#group')});
}
function changeModuleGroup(_moduleGroupId) {var pre = "";if (_moduleGroupId == "1") {pre = "GXA";} else if (_moduleGroupId == "2") {pre = "GXB";} else if (_moduleGroupId == "3") {pre = "GXC";}$.ajax({type : 'POST',dataType : "json",url : basePath + "module/getMax.do",data : {'_moduleGroupId' : _moduleGroupId},async : false,success : function(data) {if (data.success) {pre = pre + data.msg;$('#_classname').val(pre);$('#_orderId').val(data.msg);$('#_isenter').val("1");$('#_issync').val("0");} else {alert(data.msg);}}});
}

<%@page language="java" contentType="text/html; charset=UTF-8"pageEncoding="UTF-8"%>
<%@ include file="/jsp/common.jsp" %>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html><head><title></title><link rel="stylesheet" href="<%=basePath %>js/layui-v2.5.5/layui/css/layui.css?v=20200101"></head>
<body style="padding-top:15px;"><div class="layui-fluid"><div class="layui-card"><div class="layui-form layui-card-header"><div class="layui-form-item"><div class="layui-inline"><label class="layui-form-label">模块分组</label><div class="layui-input-inline"><select name="_moduleGroupId"><c:forEach items="${groups }" var="group"><option value="${group._id}">${group._name }</option></c:forEach></select></div></div><div class="layui-inline"><label class="layui-form-label">模块名称</label><div class="layui-input-inline"><input type="text" name="_name" placeholder="请输入模块名称" autocomplete="off" class="layui-input"></div></div><div class="layui-inline"><label class="layui-form-label">模块类名</label><div class="layui-input-inline"><input type="text" name="_classname" placeholder="请输入模块类名" autocomplete="off" class="layui-input"></div></div><div class="layui-inline"><button class="layui-btn layui-btn-sm" lay-submit lay-filter="module-tbl-search"><i class="layui-icon layui-icon-search"></i>  查 询</button></div></div></div><div class="layui-card-body"><!-- 系统模块原始容器: --><table id="module-tbl" lay-filter="module-tbl" style="margin:0 5px;padding:0px;"></table></div></div>
</div>    <!-- 工具栏模板： --><script type="text/html" id="module-tbl-toolbar"><div class="layui-btn-container"><a class="layui-btn layui-btn-sm" lay-event="addUI">添加系统模块</a><a class="layui-btn layui-btn-sm layui-btn-normal" lay-event="refresh">刷新</a></div></script><!-- 设置配置模板 --><script type="text/html" id="equipmentTmp">{{#  if(d._equipment == 'A'){ }}单台{{#  } else if(d._equipment == 'B'){ }}双台{{#  } }}</script><!-- 生成数据表模板 --><script type="text/html" id="generateTmp">{{#  if(d._generate_flag == '1'){ }}<font color='green'>已生成</font>{{#  } else{ }}<font color='red'>未生成</font>{{#  } }}</script><script type="text/html" id="module-rowtbl-toolbar">{{#  if(d._generate_flag == '1'){ }}<a class="layui-btn layui-btn-xs" lay-event="updateModule">编辑</a>{{#  } else{ }}<a class="layui-btn layui-btn-xs" lay-event="updateModule">编辑</a><a class="layui-btn layui-btn-xs layui-btn-warm" lay-event="generate">生成数据表</a>{{#  } }}<a class="layui-btn layui-btn-xs layui-btn-danger" lay-event="deleteModule">删除</a></script><!-- 分组菜单 --><script type="text/html" id="group-tbl-toolbar"><a class="layui-btn layui-btn-xs" lay-event="selectGroup">确定</a></script><!-- 添加用户弹出层 --><div id="add-module-layer" style="display: none; padding: 20px"><form id="add-module-form" class="layui-form layui-form-pane"><div class="layui-form-item"><label class="layui-form-label">所属模块分组</label><div class="layui-input-block"><input type="hidden" id="_moduleGroupId" name="_moduleGroupId"><input type="text" id="_moduleGroupName" name="_moduleGroupName" onclick="selectModuleGroup();" autocomplete="off" class="layui-input" lay-verify="required"></div></div><div class="layui-form-item"><label class="layui-form-label">工位</label><div class="layui-input-block"><input type="text" id="_name" name="_name" class="layui-input" lay-verify="required" autocomplete="off"></div></div><div class="layui-form-item"><label class="layui-form-label">类名</label><div class="layui-input-block"><input type="text" id="_classname" name="_classname" class="layui-input" lay-verify="required" autocomplete="off"></div></div><div class="layui-form-item"><label class="layui-form-label">顺序号</label><div class="layui-input-block"><input type="text" id="_orderId" name="_orderId" class="layui-input" lay-verify="required" autocomplete="off"></div></div><div class="layui-form-item"><label class="layui-form-label">模块录入标识</label><div class="layui-input-block"><input type="text" id="_isenter" name="_isenter" class="layui-input" lay-verify="required" autocomplete="off"></div></div><div class="layui-form-item"><label class="layui-form-label">同步工序</label><div class="layui-input-block"><input type="text" id="_issync" name="_issync" class="layui-input" lay-verify="required" autocomplete="off"></div></div><div class="layui-form-item"><label class="layui-form-label">设备配置</label><div class="layui-input-block"><select name="_equipment" lay-filter="aihao"><option value="A">单台</option><option value="B">双台</option></select></div></div><div class="layui-form-item layui-form-text"><label class="layui-form-label">备注</label><div class="layui-input-block"><textarea placeholder="请输入内容" class="layui-textarea" name="_remarks"></textarea></div></div><div class="layui-form-item"><div class="layui-input-block"><button class="layui-btn" lay-submit lay-filter="add-module-form-submit">提交</button><%--<button type="reset" class="layui-btn layui-btn-primary">重置</button>--%></div></div></form></div><!-- 更新用户弹出层 --><div id="update-module-layer" style="display: none; padding: 20px"><form id="update-module-form" class="layui-form layui-form-pane" lay-filter="update-module-form"><div class="layui-form-item" style="display: none;"><label class="layui-form-label">_id</label><div class="layui-input-block"><input type="text" name="_id" class="layui-input" readonly></div></div><div class="layui-form-item"><label class="layui-form-label">所属模块分组</label><div class="layui-input-block"><input type="hidden" name="_moduleGroupId"><input type="text" name="_moduleGroupName" readonly="readonly" autocomplete="off" class="layui-input" lay-verify="required"></div></div><div class="layui-form-item"><label class="layui-form-label">工位</label><div class="layui-input-block"><input type="text" name="_name" class="layui-input" lay-verify="required" autocomplete="off"></div></div><div class="layui-form-item"><label class="layui-form-label">类名</label><div class="layui-input-block"><input type="text" name="_classname" class="layui-input" lay-verify="required" autocomplete="off"></div></div><div class="layui-form-item"><label class="layui-form-label">顺序号</label><div class="layui-input-block"><input type="text" name="_orderId" class="layui-input" lay-verify="required" autocomplete="off"></div></div><div class="layui-form-item"><label class="layui-form-label">模块录入标识</label><div class="layui-input-block"><input type="text" id="_isenter" name="_isenter" class="layui-input" lay-verify="required" autocomplete="off"></div></div><div class="layui-form-item"><label class="layui-form-label">同步工序</label><div class="layui-input-block"><input type="text" id="_issync" name="_issync" class="layui-input" lay-verify="required" autocomplete="off"></div></div><div class="layui-form-item"><label class="layui-form-label">设备配置</label><div class="layui-input-block"><select name="_equipment" lay-filter="_equipment"><option value="A">单台</option><option value="B">双台</option></select></div></div><div class="layui-form-item layui-form-text"><label class="layui-form-label">备注</label><div class="layui-input-block"><textarea placeholder="请输入内容" class="layui-textarea" name="_remarks"></textarea></div></div><div class="layui-form-item"><div class="layui-input-block"><button class="layui-btn" lay-submit lay-filter="update-module-form-submit">提交</button><button type="reset" class="layui-btn layui-btn-primary">重置</button></div></div></form></div><div id="group" style="display:none;padding:10px 10px;"><table id="group-tbl" lay-filter="group-tbl"></table></div><!-- layui的引用 js --><script type="text/javascript" src="<%=basePath %>js/layui-v2.5.5/layui/layui.js"></script><!-- 页面JS --><script>var basePath = "<%=basePath %>";</script><script type="text/javascript" src="<%=basePath %>jsp/system/module/index.js?v=202011306"></script></body>
</html>

layer 一些理解相关推荐

对Docker镜像layer的理解
对Docker镜像layer的理解转自:https://blog.csdn.net/u011069294/article/details/105583522 FROM python:3.6.1-al ...
softmax layer 简单理解以及实际例子【有白话讲解】
Softmax函数将多个标量映射为一个概率分布,其输出的每一个值范围在(0,1). 大概就是将数据缩放到0-1的区间之内吧. 输出向量为[3,1,-3],3代表类别1的分量:1代表类别2对应的分量:- ...
cocos2dx layer理解
对Layer的理解 /cocos2d-x-3.0alpha0/extensions/CocoStudio/GUI/System // 获取 UIInputManager,添加/移除 widget ,设 ...
彻底理解position与anchorPoint - Wonderffee's Blog（转）
引言相信初接触到CALayer的人都会遇到以下几个问题: 为什么修改anchorPoint会移动layer的位置? CALayer的position点是哪一点呢? anchorPoint与posi ...
彻底理解position与anchorPoint
引言相信初接触到CALayer的人都会遇到以下几个问题: 为什么修改anchorPoint会移动layer的位置? CALayer的position点是哪一点呢? anchorPoint与posi ...
position与anchorPoint理解(一)
转自彻底理解position与anchorPoint 关于CALayer和UIView的介绍请移步:CALayer与UIView的关系每一个UIView内部都默认关联着一个CALayer, UIV ...
iOS的layer的anchorpoint与posion问题
每一个UIView内部都默认关联着一个CALayer, UIView有frame.bounds和center三个属性,CALayer也有类似的属性,分别为frame.bounds.position.a ...
彻底理解CALayer的position与anchorPoint
引言相信初接触到CALayer的人都会遇到以下几个问题: 为什么修改anchorPoint会移动layer的位置? CALayer的position点是哪一点呢? anchorPoint与p ...
MVP模式的相关知识
MVP 是从经典的模式MVC演变而来,它们的基本思想有相通的地方:Controller/Presenter负责逻辑的处理,Model提供数据,View负责显示.作为一种新的模式,MVP与MVC有着一个 ...

layer 一些理解

layer 一些理解相关推荐

最新文章

热门文章