上一章已经说明了在Jqgrid中如何对数据分组,这一章主要探讨如何格式化Jqgrid中的数据。何谓格式化呢?举个例子,比如对时间格式化处理,去掉后面的时分秒;对数字进行处理,加上千分位分隔符,小数的保留位数,加上前缀或后缀。对超链接或邮箱等等。

        jqGrid中对列表cell属性格式化设置主要通过colModel中formatter、formatoptions来设置的。jqGrid中也预定义了常见的格式及其options属性。
formatter formatoptions
integer  thousandsSeparator://千分位分隔符, 如”,” defaulValue://默认值
currency decimalSeparator: //小数分隔符,如”.” thousandsSeparator: //千分位分隔符,如”,” decimalPlaces: //小数保留位数 defaulValue:  prefix://前缀,如加上”$” suffix://后缀
number  decimalSeparator: //小数分隔符,如”.” thousandsSeparator: //千分位分隔符,如”,” decimalPlaces: //小数保留位数 defaulValue:
date srcformat, //原来的格式 newformat //新格式
select 没有参数,使用方法如: editoptions:{value:”0:男;1:女”}} 
checkbox  disabled:true or false 
showlink  baseLinkUrl://在当前cell中加入link的url showAction://在baseLinkUrl后加入&action=actionName addParam://参数,如”&name=xx” target: idName:默认会在baseLinkUrl后加入,如”.action?id=1″。如果 设置idName=”XX”,那么”.action?XX=1″。取值为当前rowid
email 没有参数

用法也比较简单,在Jqgrid的ColModel加入相应的formatter和formatoptions即可。如:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
{
name : "age",
index : "age",
label : "年龄",
width : 120,
sortable : true,
align : 'center',
formatter : "number",
formatoptions : {
decimalSeparator : ".",
thousandsSeparator : ",",
decimalPlaces : 0,
defaulValue : 0
},

如果预定义的格式化不能满足你的要求,Jqgrid还提供了自定义格式化数据的方式。语法为:

1
2
3
function DIYFmatter(cellvalue, options, rowObject){
//your code
}

对于自定义formatter,在修改时需要获取原来的值,这里就提供了unformat函数。如:

1
2
3
4
5
6
7
8
9
10
{
name : "age",
index : "age",
label : "年龄",
width : 120,
sortable : true,
align : 'center',
formatter : DIYFmatter,
unformat:DIYUnFormat
}

然后自己写自定义格式化的方法。如:

1
2
3
4
5
6
7
8
function DIYFormat( cellvalue, options, rowObject ){
return '<img alt="" src="'+cellvalue+'" />';
}
function DIYUnFormat( cellvalue, options, cell){
 
return $('img', cell).attr('src');
 
}

如果还有什么疑惑的地方,可以留言。

原创文章,转载请注明: 转载自java开发者

本文链接地址: Jqgrid入门-Jqgrid格式化数据(九)

Jqgrid入门-Jqgrid格式化数据(九)的更多相关文章

  1. Jqgrid入门-Jqgrid分组的实现(八)

    上一章主要说明了如果实现Jqgrid列数据拖动,这一章主要讨论在Jqgrid中如何实现分组功能.         类似于Sql语句的Group By,Jqgrid提供了属性实现数据分组,这样表现数据会 ...

  2. Jqgrid入门-Jqgrid列数据拖动(七)

    上一章提到在Jqgrid中如何设置二级表头,这一章节主要探讨Jqgrid表格里面的数据如果实现拖动功能,比如你想把第一行的数据拖到当前页的最后一行,或者其他位置.     Jqgrid表格插件自己没有 ...

  3. Jqgrid入门-Jqgrid设置二级表头(六)

    上一章已经说明了Jqgrid结合Struts2+json展示数据,这一章主要探讨Jqgrid如何设置二级表头,类似这样的效果.如:           要实现这个功能,其实也不难.通过Jqgrid的s ...

  4. Jqgrid入门-结合Struts2+json实现数据展示(五)

    DEMO用的是ssh框架实现的,具体怎么搭建的就不多做说明了.分页表格的数据操作难点就是数据展现.至于增删改直接用hibernate原生的方法实现即可.         初步分析:表格要实现分页,那么 ...

  5. Jqgrid入门-别具特色的Pager Bar (四)

    Pager Bar位于表格最下边.默认情况下,分为三部分.如图: 第一部分:导航按钮栏(Navigator) 第二部分:页码栏(Pager) 第三部分:记录信息栏(Record)         要实 ...

  6. Jqgrid入门-使用模态对话框编辑表格数据(三)

            Jqgrid是一个强大的表格插件,它提供了多种方式来编辑数据.这三种方式分别是: Cell Editing——只允许修改某一个单元格内容 Inline Editing——允许在jqGr ...

  7. Jqgrid入门-显示基本的表格(一)

    首先对Jqgrid网格插件做个简要的说明.在众多的表格插件中,Jqgrid的特点是非常鲜明的.         特点如下: 完整的表格呈现与运算功能,包含换页.栏位排序.grouping.新增.修改及 ...

  8. 无废话ExtJs 入门教程十九[API的使用]

    无废话ExtJs 入门教程十九[API的使用] extjs技术交流,欢迎加群(201926085) 首先解释什么是 API 来自百度百科的官方解释:API(Application Programmin ...

  9. Docker入门教程(九)10个镜像相关的API

    Docker入门教程(九)10个镜像相关的API [编者的话]DockerOne组织翻译了Flux7的Docker入门教程,本文是系列入门教程的第九篇,重点介绍了镜像相关的Docker Remote ...

随机推荐

  1. nginx js、css多个请求合并为一个请求(concat模块)

    模块介绍 mod_concat模块由淘宝开发,目前已经包含在tengine中,并且淘宝已经在使用这个nginx模块.不过塔暂时没有包含在nginx中.这个模块类似于apache中的modconcat. ...

  2. 将HTMLCollection/NodeList/伪数组转换成数组

    这里把符合以下条件的对象称为伪数组(ArrayLike) 1,具有length属性 2,按索引方式存储数据 3,不具有数组的push,pop等方法 如 1,function内的arguments . ...

  3. zend studio插件

    1.安装使用Aptana插件(html,css,js代码提示功能) 安装步骤: 1).zend studio->Help->Install New Software->work wi ...

  4. VMware下Ubuntu与宿主Windows共享文件夹

    概述1.安装VMware Tool2.设置共享 步骤开始安装VMware Tool 显示如下画面(如果宿主无法访问外网,可能会出现一个更新失败,可以无视之) 通过下列命令解压.执行,分别是下面的tar ...

  5. Javascript format方法

    <!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <m ...

  6. JSTL标签库中fmt标签,日期,数字的格式化

    首先介绍日期的格式化:(不要嫌多哦) JSTL格式化日期(本地化) 类似于数字和货币格式化,本地化环境还会影响生成日期和时间的方式. <%@ page pageEncoding="UT ...

  7. 给View换字体

    注意,给View换字体是直接换.在Delegate里换的只是某一列的字体 class delegate : public QStyledItemDelegate { public: ) : QStyl ...

  8. 【原创】Eclipse中为SVN设置快捷键

            SVN是深受开发者喜爱的版本控制工具,其较CVS有更好的控制策略.在Android开发中,我也选择SVN作为版本控制工具.Eclipse的SVN插件名叫Subclipse,可以到htt ...

  9. Linux内核通杀提权漏洞CVE-2016-5195验证

    一.漏洞简介 CVE-2016-5195这个漏洞是linux内核级的本地提权漏洞,原理是linux内核内存子系统在 处理私有只读存储映射的写入时复制机制发现了一个冲突条件.这个漏洞官方给出的影响范围是 ...

  10. lua简化cocos2dx的Action动画序列

    情景 今天写代码时,又要写一个很常见的动画,就是变大变小模拟那个弹性的赶脚,很常用但写起来挺麻烦,封装一下用起来就简单多了. 当然我也知道有缓动动画(EaseAction)可以实现反弹效果,但这不是重 ...