layui操作列按钮个数和文字颜色的判断实例

一、达到的效果如图，通过值去判断是否需要该按钮 

cols: [[ //表头
 {field: 'money', title: '操作',toolbar: '#barDemos'}
 ]]
<script type="text/html" id="barDemos">
 {{# if(d.s_state == 0){ }}
 <span style="color:red">未审核</span>
 {{# }else if(d.s_state == 1){ }}
 <span>审核通过</span>
 {{# }else if(d.s_state == 2){ }}
 <span style="color:red">审核未通过</span>
 {{# } }}
</script>

重点：

//语法类似于if(){}else if(){}else
 {{# if(d.s_state == 0){ }}
 ...
 {{# }else if(d.s_state == 1){ }}
 ...
 {{# }else if(d.s_state == 2){ }}
 ...
 {{# } }}else{ }}
 ...
 {{# } }}

二、列表格内的文字颜色显示，如图：

cols: [[ //表头
 {field: 'srm_state', title: '状态',templet: '#sexTpl'}
 ]]
<script type="text/html" id="sexTpl">
 {{# if(d.srm_state == 0){ }}
 <span style="color: red;">未审核</span>
 {{# } else if(d.srm_state ==1) { }}
 <span style="color: green;">审核通过</span>
 {{# } else if(d.srm_state ==2) { }}
 <span style="color: #FFD700;">审核未通过</span> {{# } }}
</script>

以上这篇layui操作列按钮个数和文字颜色的判断实例就是小编分享给大家的全部内容了，希望能给大家一个参考，也希望大家多多支持我们。

赞 (0)

相关推荐

  • 关于layui表单中按钮自动提交的解决方法

    layui表单中的按钮会自动提交,这是一个很麻烦的事情. 这几天项目中多次用到表单按钮,仔细研究了下,找到了解决方法: 1.如果不需要放在表单中的按钮,最好不要放在表单中,不在layui的form中的按钮就不会进行自动提交了: 2.放在表单中的按钮可以通过js中的回调函数里添加 return false制止.filter中的参数指的是按钮中的lay-filter属性中的值,这个可以自己随便设. 比如: form.on('submit(filter)',function(data){ ......

  • layui点击按钮添加可编辑的一行方法

    昨天已经成功添加了一行,今天希望所添加的一行可以进行单元格编辑. 然而,发现添加了edit:'text'以后也不可以进行单元格编辑,而原本已有的数据可以,因此通过浏览器调试看了原有数据的样式,如图所示: 因此,将点击按钮添加一行<tr>标签的方法,修改为如下: $("#addTable").click(function(){ var tr=" <tr>"+ " <td data-field='domainId' data-ed

  • layui弹出层按钮提交iframe表单的方法

    如下所示: layer.open({ id: 'LAY_layuipro', //设定一个id,防止重复弹出 type: 2, title:'添加人员信息', area: ['600px','340px'], btn: ['保存','关闭'], yes: function(index, layero){ var inputForm = $(window.frames["layui-layer-iframe" + index].document).contents().find(&quo

  • layui监听工具栏的实例(操作列表按钮)

    废话不多说,直接上代码吧! <table id="demo" lay-filter="test"></table> <script type="text/html" id="barDemo"> <a class="layui-btn layui-btn-xs" lay-event="edit">查看详情</a> </scr

  • layui实现点击按钮给table添加一行

    •问题描述:想实现点击按钮在表格添加一行的功能,但发现layuii并未集成该工具栏,因此,需要自己手动添加这个功能: •原先我写的table是这样实现的: $("#addTable").click(function(){ var tr=" <tr>"+ " <td>11</td>"+ " <td>22</td>"+ " <td>33</td

  • layui 点击重置按钮, select 并没有被重置的解决方法

    如下所示: 点击重置时,输入框被重置为空,而账号 select元素并没有被重置. // 重置事件 $("#reset").click(function () { $("#searchContent").val(""); $("#selectKey").val(""); form.render(); }) 调用一下 form.render();即可 为什么表单不显示? 当你使用表单时,Layui会对selec

  • layui 数据表格 点击分页按钮 监听事件的实例

    找了 很多 关于表格分页 点击事件 请求, table.render 并不支持监听点击事件,所以我就把 table.render 和 laypage.render结合在一起 (我也不想写分页的,但是后台讲数据多 ,要加分页,被逼无奈 ,想了一个方法) 先上图 代码 .html <div> <table class="layui-hide" id="test" lay-filter="demo"></table>

  • Layui 带多选框表格监听事件以及按钮自动点击写法实例

    不话不多说了,直接上代码吧: <div class="layui-btn-group demoTable" style="margin: 10px;">   <button class="layui-btn" id="hqsj" data-type="getCheckData">获取选中行数据</button>   <button class="layui

  • layui 优化button按钮和弹出框的方法

    正常下的layui在3个button按钮 压缩之后 代码为 <button data-id="{$activity.activity_id}" style="background-color:#297911;" class="layui-btn layui-btn-small layui-btn-danger edit_store">修改门店</button> <button data-id="{$acti

  • layui操作列按钮个数和文字颜色的判断实例

    一.达到的效果如图,通过值去判断是否需要该按钮 cols: [[ //表头 {field: 'money', title: '操作',toolbar: '#barDemos'} ]] <script type="text/html" id="barDemos"> {{# if(d.s_state == 0){ }} <span style="color:red">未审核</span> {{# }else if(

  • layui 表格操作列按钮动态显示的实现方法

    1.根据表格数据动态显示操作列按钮 <script type="text/html" id="barDemo"> {{# if (d.event_level ==4){}} <a class="layui-btn layui-btn-xs layui-btn-danger" lay-event="known"><i class="layui-icon">စ</i&g

  • echarts饼图指示器文字颜色设置不同实例详解

    echarts饼图指示器文字颜色设置不同实例详解

    目录 echarts饼图label文字颜色 问题 解决方法 饼图位置 总结 学习记录,平时开发时遇到过的问题 echarts饼图label文字颜色 需求: 绘制一份环形饼状图,并且有指示器文本标签(文字的颜色需要和各部分相同) 数据: pieData: [ { name: '犯人', value: 30 }, { name: '官差', value: 35 }, { name: '平民', value: 35 }, ], // 颜色 colorList: ['#EA7267', '#F0D84B

  • Easyui Datagrid自定义按钮列(最后面的操作列)

    Easyui Datagrid自定义按钮列(最后面的操作列)

    做项目的时候因为需求,要在表格的最后添加一列操作列,easyUI貌似没有提供这种功能,不过没关系,我们可以自定义来实现 版本:jQuery easyUI 1.3.2 这里我的实现方式是采用HTML形式,js方式暂时还没用到 首先是HTML部分 <table id="dg" title="学生信息" class="easyui-datagrid" url="${ctx}listStudent.do" toolbar=&qu

  • jQGrid Table操作列中点击【操作】按钮弹出按钮层的实现代码

    jQGrid Table操作列中点击【操作】按钮弹出按钮层的实现代码

    在使用JqGrid时,Table中最后一列是操作列,在操作列中每一行都一个操作按钮,该操作按钮类似下拉菜单,如下图: 在点击Table中[操作]一列时需要弹出一个Div层,该Div层中包含一堆按钮,用于对Table行进行操作,如下: 解决步骤如下: 1.首先,在colModel中的列上添加属性edittype:'select'和方法formatter:groupGrid.formatOptions,如下图: 方便复制,代码如下: {label:'操作',name: 'operations',in

  • Android开发实现按钮点击切换背景并修改文字颜色的方法

    本文实例讲述了Android开发实现按钮点击切换背景并修改文字颜色的方法.分享给大家供大家参考,具体如下: 其实原理很简单,用到的是selector,用来设置android:background和android:textcolor属性,selector可以用来设置默认时候.点击时候的背景图片和文字颜色的属性,过程如下: 这两个文件如下: 1.当点击按钮,改变文字的颜色: <?xml version="1.0" encoding="utf-8"?> <

  • layui table设置某一行的字体颜色方法

    table自带的可以设置某一个单元格颜色,必须根据内容来修改,对于很多列同时修改并不方便,直接使用js操作比较简单. 首先自定义一个div,内部存放table,根据class找到table,然后找到行tr,修改其样式中的颜色. //设置layui datatable的某一行的颜色 //TabDivId:tab父div id;RowIndex:行序列号,从0开始:ColorString:颜色字符串,如'#123456' function Layui_SetDataTableRowColor(Tab

  • 修改Android FloatingActionButton的title的文字颜色及背景颜色实例详解

    修改Android FloatingActionButton的title的文字颜色及背景颜色实例详解

    修改Android FloatingActionButton的title的文字颜色及背景颜色实例详解 首先看一张图片 我是在一个不错的开源的FloatingActionButton库基础上实现的,链接github开源库 参考图片的标记和代码里的注释.代码如下: <com.getbase.floatingactionbutton.FloatingActionsMenu android:id="@+id/fab_meau" android:layout_width="wra

  • layui点击按钮页面会自动刷新的解决方案

    问题: <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> <link rel="stylesheet" href="../../layuiadmin/layui/css/layui.css" rel="external no

随机推荐