雷林鹏分享:jQuery EasyUI 数据网格 - 条件设置行背景颜色
jQuery EasyUI 数据网格 - 条件设置行背景颜色
本教程将向您展示如何根据一些条件改变数据网格(datagrid)组件的行样式。当 listprice 值大于 50 时,我们将为该行设置不同的颜色。

数据网格(datagrid)的 rowStyler 函数的设计目的是允许您自定义行样式。以下代码展示如何改变行样式:
url="data/datagrid_data.json"
singleSelect="true" fitColumns="true">
| Item ID | Product ID | List Price | Unit Cost | Attribute | Stauts |
|---|
$('#tt').datagrid({
rowStyler:function(index,row){
if (row.listprice>50){
return 'background-color:pink;color:blue;font-weight:bold;';
}
}
});
正如您所看到的,我们根据一些条件设置 background-color(背景色)为 pink(粉红色),设置文本颜色为 blue(蓝色)。
下载 jQuery EasyUI 实例
jeasyui-datagrid-datagrid18.zip
本文转载自:w3cschool(编辑:雷林鹏 来源:网络 侵删)
雷林鹏分享:jQuery EasyUI 数据网格 - 条件设置行背景颜色的更多相关文章
- jQuery EasyUI 数据网格 - 条件设置行背景颜色
$('#tt').datagrid({ rowStyler:function(index,row){ if (row.listprice>50){ return 'color:blue;font ...
- EasyUI 条件设置行背景颜色
数据网格(datagrid)的 rowStyler 函数的设计目的是允许您自定义行样式. rowStyler 函数需要两个参数: rowIndex:行的索引,从 0 开始. rowData:该行相应的 ...
- 雷林鹏分享:jQuery EasyUI 数据网格 - 设置冻结列
jQuery EasyUI 数据网格 - 设置冻结列 本实例演示如何冻结一些列,当用户在网格上移动水平滚动条时,冻结列不能滚动到视图的外部. 为了冻结列,您需要定义 frozenColumns 属性. ...
- 雷林鹏分享:jQuery EasyUI 数据网格 - 创建复杂工具栏
jQuery EasyUI 数据网格 - 创建复杂工具栏 数据网格(datagrid)的工具栏(toolbar)可以包含按钮及其他组件. 您可以通个一个已存在的 DIV 标签来简单地定义工具栏布局,该 ...
- 雷林鹏分享:jQuery EasyUI 数据网格 - 动态改变列
jQuery EasyUI 数据网格 - 动态改变列 数据网格(DataGrid)列可以使用 'columns' 属性简单地定义.如果您想动态地改变列,那根本没有问题.为了改变列,您可以重新调用dat ...
- 雷林鹏分享:jQuery EasyUI 数据网格 - 格式化列
jQuery EasyUI 数据网格 - 格式化列 以下实例格式化在 easyui DataGrid 里的列数据,并使用自定义列的 formatter,如果价格小于 20 就将文本变为红色. 为了格式 ...
- 雷林鹏分享:jQuery EasyUI 数据网格 - 设置排序
jQuery EasyUI 数据网格 - 设置排序 本实例演示如何通过点击列表头来排序数据网格(DataGrid). 数据网格(DataGrid)的所有列可以通过点击列表头来排序.您可以定义哪列可以排 ...
- 雷林鹏分享:jQuery EasyUI 数据网格 - 创建列组合
jQuery EasyUI 数据网格 - 创建列组合 easyui 的数据网格(DataGrid)可以创建列组合,如下所示: 在本实例中,我们使用平面数据来填充数据网格(DataGrid)的数据,并把 ...
- 雷林鹏分享:jQuery EasyUI 数据网格 - 自定义排序
jQuery EasyUI 数据网格 - 自定义排序 如果默认的排序行为不满足您的需求,您可以自定义数据网格(datagrid)的排序行为. 最基础的,用户可以在列上定义一个排序函数,函数名是 sor ...
随机推荐
- [daily][mathematica][fcitx] mathematica 无法输入中文的问题
mathematica无法输入中文, 我的输入法使用 fcitx 于是我给fcitx的作者提了issue https://github.com/fcitx/fcitx/issues/372 数日之后, ...
- 5、jeecg 笔记之 minidao 条件判断
1.前言 我们知道 mybatis 中的动态sql语句是基于 OGNL 表达式的. 额外补充一点:mybatis 中的 #{} 和 ${} ,可直接跳过. #{}表示一个占位符号,#{}接收输 ...
- 【LeetCode每天一题】Combinations(组合)
Given two integers n and k, return all possible combinations of k numbers out of 1 ... n. Example: I ...
- 我用MATLAB撸了一个2D LiDAR SLAM
0 引言 刚刚入门学了近一个月的SLAM,但对理论推导一知半解,因此在matlab上捣鼓了个简单的2D LiDAR SLAM的demo来体会体会SLAM的完整流程. (1)数据来源:德意志博物馆Deu ...
- selenium.common.exceptions.WebDriverException: Message: unknown Error: cannot find Chrome binary
使用Chrome浏览器时,经常会遇到以下报错:浏览器没有调用起来 selenium.common.exceptions.WebDriverException: Message: unknown Err ...
- 解决.NET iis初次加载超级慢
禁止证书的验证过程:1.在下面aspnet.config文件中加入下面内容: 32位系统:C:\Windows\Microsoft.NET\Framework\v2.0.50727\aspne ...
- Lambda表达式详解(例子详解)(转自:http://blog.csdn.net/damon316/article/details/51734661)
Lambda表达式详解(例子详解) lambda简介 lambda运算符:所有的lambda表达式都是用新的lambda运算符 " => ",可以叫他,“转到”或者 ...
- linux挂载概念简述:
挂载概念简述: 根文件系统之外的其他文件要想能够被访问,都必须通过“关联”至根文件系统上的某个目录来实现,此关联操作即为“挂载”,此目录即为“挂载点”,解除此关联关系的过程称之为“卸载” 1.挂载:根 ...
- db2空值、null
1. 输入参数为字符类型,且允许为空的,可以使用COALESCE(inputParameter,'')把NULL转换成''; 2. 输入类型为整型,且允许为空的,可以使用COALESCE(inputP ...
- This Debug perspective is designed to support application debugging.it incorporates views for displaying the debug stack,variables and breakpoint mamagement
使用IDE(Eclipse Version:Neon.2 Release (4.6.2)),出现以下提示信息: This kind of launch is configured to openthe ...