淺談layui數(shù)據(jù)表格判斷問(wèn)題(加入表單元素),設(shè)置單元格樣式
如下所示:
<script type="text/html" id="status"> {{# if(d.status === 1){ }} <span class="layui-badge layui-bg-green">正常</span> {{# } else { }} <span class="layui-badge">禁用</span> {{# } }} </script> layui.use(['layer', 'form','table'], function(){ layer = layui.layer; var table = layui.table; //第一個(gè)實(shí)例 table.render({ elem: '#demo' ,url: get_menu //數(shù)據(jù)接口 ,headers: {Authorization: token} ,page: false //開(kāi)啟分頁(yè) ,cols: [[ //表頭 {type:'checkbox'} ,{field: 'userId', title: 'ID', width:80, sort: true} ,{field: 'username', title: '用戶名', width:150} ,{field: 'email', title: '郵箱', width:250} ,{field: 'mobile', title: '手機(jī)號(hào)', width:200} ,{field: 'status', title: '狀態(tài)', width:150, templet: '#status'} ,{field: 'createTime', title: '創(chuàng)建時(shí)間', width:300} ,{fixed: 'right', title:'操作', toolbar: '#barDemo', width:200} ]] ,parseData: function(res){ return { "code": res.code, //解析接口狀態(tài) "msg": res.msg, //解析提示文本 "data": res.data //解析數(shù)據(jù)列表 } } }); });
如果是多個(gè)條件的話:
<script type="text/html" id="status"> {{# if(d.status === 0 ){ }} <button type="button" class="layui-btn">待審批</button> {{# } }} {{# if(d.status === 1 ){ }} <button type="button" class="layui-btn layui-btn-normal">審批通過(guò)</button> {{# } }} {{# if(d.status === 2 ){ }} <button type="button" class="layui-btn layui-btn-danger">未通過(guò)</button> {{# } }} </script>
以上這篇淺談layui數(shù)據(jù)表格判斷問(wèn)題(加入表單元素),設(shè)置單元格樣式就是小編分享給大家的全部?jī)?nèi)容了,希望能給大家一個(gè)參考,也希望大家多多支持腳本之家。
相關(guān)文章
解析微信JS-SDK配置授權(quán),實(shí)現(xiàn)分享接口
這篇文章是微信開(kāi)發(fā)的很多前置條件,包括了服務(wù)端基于JAVA的獲取和緩存全局的access_token,獲取和緩存全局的jsapi_ticket,以及前端配置授權(quán)組件封裝,調(diào)用分享組件封裝。需要的朋友可以看下2016-12-12JS按鈕倒計(jì)時(shí)并跳轉(zhuǎn)到新地址的實(shí)現(xiàn)代碼
在完成某項(xiàng)操作時(shí),按鈕上有個(gè)倒計(jì)時(shí)效果,倒計(jì)時(shí)結(jié)束后,跳轉(zhuǎn)到新地址,這篇文章主要介紹了JS按鈕倒計(jì)時(shí)并跳轉(zhuǎn)到新地址,需要的朋友可以參考下2023-02-02實(shí)現(xiàn)JavaScript高性能的數(shù)據(jù)存儲(chǔ)
本文主要對(duì)JavaScript的數(shù)據(jù)存儲(chǔ),產(chǎn)生性能問(wèn)題的原因,內(nèi)存泄露的幾種情況等做了簡(jiǎn)要分析介紹,需要的朋友可以看下2016-12-12利用Print.js實(shí)現(xiàn)打印pdf、HTML及圖片(可設(shè)置樣式可分頁(yè))
在我們需要在頁(yè)面中打印某個(gè)區(qū)域的內(nèi)容或者生成pdf的時(shí)候,我們可以直接用printJs庫(kù),這篇文章主要給大家介紹了關(guān)于利用Print.js實(shí)現(xiàn)打印pdf、HTML及圖片的相關(guān)資料,可設(shè)置樣式可分頁(yè),需要的朋友可以參考下2024-05-05老生常談JavaScript面向?qū)ο蠡A(chǔ)與this指向問(wèn)題
下面小編就為大家?guī)?lái)一篇老生常談JavaScript面向?qū)ο蠡A(chǔ)與this指向問(wèn)題。小編覺(jué)得挺不錯(cuò)的,現(xiàn)在就分享給大家,也給大家做個(gè)參考。一起跟隨小編過(guò)來(lái)看看吧2017-10-10Bootstrap Modal對(duì)話框如何在關(guān)閉時(shí)觸發(fā)事件
這篇文章主要為大家詳細(xì)介紹了Bootstrap Modal對(duì)話框如何在關(guān)閉時(shí)觸發(fā)事件,具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下2016-12-12