easyui DataGrid中格式化列,如果单价低于20,则使用定义列formatter为红色文本。

格式化DataGrid列,我们应该设置formatter属性,这个属性是一个函数。格式化函数包括两个参数:
· value: 显示字段当前列的值
· record: 当前行记录数据 
Markup
<table id="tt"></table>
jQuery
$('#tt').datagrid({
    title:'Formatting Columns',
    width:550,
    height:250,
    url:'datagrid_data.json',
    columns:[[
        {field:'itemid',title:'Item ID',width:80},
        {field:'productid',title:'Product ID',width:80},
        {field:'listprice',title:'List Price',width:80,align:'right',
            formatter:function(val,rec){
                if (val < 20){
                    return '<span style="color:red;">('+val+')</span>';
                } else {
                    return val;
                }
            }
        },
        {field:'unitcost',title:'Unit Cost',width:80,align:'right'},
        {field:'attr1',title:'Attribute',width:100},
        {field:'status',title:'Status',width:60}
    ]]
});

EasyUI 格式化DataGrid列的更多相关文章

  1. EasyUI的datagrid列属性添加超链接

    $("#dg").datagrid({        url: "../Ajax/PurchaseAjax.ashx",        queryParams: ...

  2. easyUI 中datagrid 返回列隐藏方法

    easyui的datagrid方法返回的列,有的值不需要显示可以使用hidden(属性进行隐藏) columns : [ [{ field : 'bailClass', title : '类别', w ...

  3. EasyUI 中 DataGrid 控件 列 如何绑定对象中的属性

    EasyUI 中 DataGrid 控件 是我们经常用到的控件之一, 但是 DataGrid 控件 在绑定显示列时却不支持对象属性绑定. 模型如下: public class Manager impl ...

  4. easyui的datagrid行的某一列添加链接

    通过formatter方法给easyui 的datagrid 每行增加操作链接. 效果图 jsp代码: <th field="url" width="100&quo ...

  5. easyui datagrid 列隐藏和显示

    easyui datagrid 列隐藏和显示 用js怎么控制列的显示和隐藏?   最佳答案   $('#grid').datagrid('hideColumn','列field');把hideColu ...

  6. 让jquery easyui datagrid列支持绑定嵌套对象

    嵌套对象是指返回的json数据,是对象的某个属性自带有属性.而我们恰恰又需要这个属性,默认情况下easyui的datagrid是不支持绑定嵌套对象的.比如:datagrid的field属性只能为fie ...

  7. [Easyui - Grid]为easyui的datagrid、treegrid增加表头菜单,用于显示或隐藏列

    为easyui的datagrid.treegrid增加表头菜单,用于显示或隐藏列 /** * @author 孙宇 * * @requires jQuery,EasyUI * * 为datagrid. ...

  8. easyui datagrid列使用按钮的一些心得 .

    以前,用easyui的datagrid,有时候会用到一些操作选项,比如代码如下: $('#datagrid').datagrid({ border:false, fitColumns:true, si ...

  9. easyui datagrid列使用按钮的一些心得(转)

    http://blog.csdn.net/sskicgah/article/details/16939959 以前,用easyui的datagrid,有时候会用到一些操作选项,比如代码如下: $('# ...

随机推荐

  1. Java基础(46):选择排序的Java封装(完整可运行)

    1 package lsg.ap.select; import java.util.Random; public class SelectSort { //选择排序 /** *@author: 梁山广 ...

  2. paper 42 :图像的小波变换

    关于小波变换我只是有一个很朴素了理解.不过小波变换可以和傅里叶变换结合起来理解. 傅里叶变换是用一系列不同频率的正余弦函数去分解原函数,变换后得到是原函数在正余弦不同频率下的系数. 小波变换使用一系列 ...

  3. paper 27 :图像/视觉显著性检测技术发展情况梳理(Saliency Detection、Visual Attention)

    1. 早期C. Koch与S. Ullman的研究工作. 他们提出了非常有影响力的生物启发模型. C. Koch and S. Ullman . Shifts in selective visual ...

  4. :nth-child()和:nth-of-type(n)区别

    ele:nth-child(n) 父元素下第n个元素且这个元素为ele ele:nth-of-type(n) 指父元素下第n个ele元素

  5. FM000

    SQL> select To_char(1,'000') from dual; TO_C----001 注意最左边有一个空格 SQL> select To_char(1,'FM000') ...

  6. PAT乙级 1005. 继续(3n+1)猜想 (25)

    1005. 继续(3n+1)猜想 (25) 时间限制 400 ms 内存限制 65536 kB 代码长度限制 8000 B 判题程序 Standard 作者 CHEN, Yue 卡拉兹(Callatz ...

  7. 关于teleport_pro使用过程中的一点疑惑

    在我新建工程的时候,有两个选项,一个是"new project wizard"另一个是"new project",然后就纠结了,我应该使用那个呢? 使用第一个的 ...

  8. 解析XML的四种方式

    四种操作xml的方式: SAX, DOM, JDOM , DOM4J的比较 1. 介绍 1)DOM(JAXP Crimson解析器)         DOM是用与平台和语言无关的方式表示XML文档的官 ...

  9. awk,perl,python的命令行参数处理

    Python,Perl,Bash命令行参数 Part I 日常经常性的和Perl,Python,Bash打交道,但是又经常性的搞混他们之间,在命令行上的特殊性和index的区别,Python真的是人性 ...

  10. mysql-5.5.28源码安装过程中错误总结

    介绍一下关于mysql-5.5.28源码安装过程中几大错误总结,希望此文章对各位同学有所帮助.系统centOS 6.3 mini (没有任何编译环境)预编译环境首先装了众所周知的 cmake(yum ...