给bootstrap table设置行列单元格样式
1、根据单元格或者行内其他单元格的内容,给该单元格设置一定的css样式
columns: [{
field: 'index',
title: '序号',
align:"center",
formatter:function(value, row, index){
return index+1;
},
cellStyle:{
css:{"background-color":"red"}
}
}]
这样的代码可以将序号这个单元格的背景色改成红色,可以发现无非是给这个json加上一个cellStyle,其内容又是一个json对象,里面对应着key-value形式的数据,从而改变单元格的样式。
那如何根据其数据内容来改变这个样式呢,参考上面的formatter的方法,我们可以将cellStyle部分这样改动一下。
cellStyle:function(value,row,index){
if (value==1){
return {css:{"background-color":"red"}}
}else{
return {css:{"background-color":"green"}}
}
}
根据value(该单元格的值),row(该行的数据对象),index(= =就是简单的表示该列表的第几个,从0开始)这三个属性就行条件的判定,只要依旧返回json对象就好了,多个css之间用逗号隔开就行。
2、根据单元格或者行内其他单元格的内容,给该单元格设置一定的css样式
与刚才的方式类似,只不过这次并不是加在colums内的json数组里,而是和colums平级放置,代码如下:
rowStyle:function(row,index){
if (index==1){
return {css:{"background-color":"red"}}
}else{
return {css:{"background-color":"green"}}
}
},
columns: [...]
cellStyle可以针对单个单元格的
value进行样式的设置,rowStyle虽然也可以加入value参数,但是好像没什么意义。
给bootstrap table设置行列单元格样式的更多相关文章
- POI设置excle单元格样式
Java利用POI生成Excel强制换行 使用POI创建一个简单的 myXls.xls 文件 常用的包为 org.apache.poi.hssf.usermodel.*; ...
- POI HSSFCellStyle 设置 Excel 单元格样式
POI中可能会用到一些需要设置EXCEL单元格格式的操作小结: 先获取工作薄对象: HSSFWorkbook wb = new HSSFWorkbook(); HSSFSheet sheet = wb ...
- EXCEL设置选中单元格样式
你想这样啊,试试这段代码看行不:右键工作表名称--查看代码,在空白处粘贴就可以 Private Sub Worksheet_SelectionChange(ByVal Target As Range) ...
- 【POI xlsx】使用POI对xlsx的单元格样式进行设置 / 使用POI对xlsx的字体进行设置
涉及到的样式都在代码中有说明: package com.it.poiTest; import java.io.FileNotFoundException; import java.io.FileOut ...
- 用NPOI创建Excel、合并单元格、设置单元格样式、边框的方法
本篇文章小编为大家介绍,用NPOI创建Excel.合并单元格.设置单元格样式.边框的方法.需要的朋友参考下 今天在做项目中,遇到使用代码生成具有一定样式的Excel,找了很多资料,最后终于解决了,Ex ...
- 创建excel,合并单元格,设置单元格样式
package com.huawei.excel; import java.io.File;import java.io.FileOutputStream;import java.util.Date; ...
- NPOI 生成Excel (单元格合并、设置单元格样式:字段,颜色、设置单元格为下拉框并限制输入值、设置单元格只能输入数字等)
NPIO源码地址:https://github.com/tonyqus/npoi NPIO使用参考:源码中的 NPOITest项目 下面代码包括: 1.包含多个Sheet的Excel 2.单元格合并 ...
- 设置table表格的单元格间距两种方式
table表格里设置单元格td之间的间距,通常用cellspacing设置单元格间距,有时候该属性可能无效,或需要用其他方式时,可用其他方式实现,例如在背景是白色背景的时候,设置单元格td的borde ...
- poi的各种单元格样式以及一些常用的配置
之前我做过一个poi到处excel数据的博客,但是,后面使用起来发现,导出的数据单元格样式都不对. 很多没有居中对齐,很多单元格的格式不对,还有就是单元格的大小不对,导致数据显示异常,虽然功能可以使用 ...
随机推荐
- docker--compose--sonarqube
Create this docker-compose.yml file: version: "2" services: sonarqube: image: sonarqube po ...
- POJ3273-Monthly Expense-二分答案
FJ对以后的每一天会花mi块钱,他想把这些天分成M个时段,然后每个时段的花费和最小. 二分答案,如果加上这天还没有达到mid,就加上它.之后看分成的时段是否大于M #include <cstdi ...
- python 模块和包
一,模块 1,什么是模块? 常见的场景: 一个模块就是一个包含了python定义和声明的文件,文件名就是模块名字加上.py 的后缀. 但其实 import 加载的模块分为四个通用类别: 1,使用pyt ...
- HDU - 1260 (Tickets)
题意: 买票 一个人要么自己买 要么和前面的人一起买 这两种情况分别有一个买票所花费的时间 求总的花费时间最小 解析: dp[i] 表示前i个人买票总的花费时间 v[i]表示第i个人买 ...
- git上传到码云
touch README.md git init git add README.md git add "你的文件" git commit -m "first commit ...
- 解决jupyter中无自己创建的虚拟环境
最近看的教程都是用的jupyter,按理说都一样吧,但是pycharm中python有的模块就弃用了,而jupyter却都可以用,而且jupyter听说也不错,就配置了一下下 1.打开cmd,激活你的 ...
- 从TensorFlow到PyTorch:九大深度学习框架哪款最适合你?
开源的深度学习神经网络正步入成熟,而现在有许多框架具备为个性化方案提供先进的机器学习和人工智能的能力.那么如何决定哪个开源框架最适合你呢?本文试图通过对比深度学习各大框架的优缺点,从而为各位读者提供一 ...
- Python爬虫:HTTP协议、Requests库
HTTP协议: HTTP(Hypertext Transfer Protocol):即超文本传输协议.URL是通过HTTP协议存取资源的Internet路径,一个URL对应一个数据资源. HTTP协议 ...
- websocket c++ example
//============================================================================ // Name : websocket.c ...
- qbxt的题:找一个三元环
有向图中找一个三元环 题意: 考虑 N 个人玩一个游戏, 任意两个人之间进行一场游戏 (共 N*(N-1)/2 场),且每场一定能分出胜负.现在,你需要在其中找到三个人构成的这样的局面:A战胜B,B战 ...