从数据库中提取的信息,有时候需要后期处理一下,easy_ui给了我们很好的一个方法,根据easy_ui生成datagridview的两种方式,下面用两种方式来格式化显示数据信息

1,通过脚本生成的datagridview,这个时候在制定列属性的时候,我们可以添加formatter方法,如下所示

$('#gridTable').datagrid({
title: '系统通知及广告管理',
loadMsg:'数据加载中,请稍后……',
rownumbers: true,
pagination: true,
singleSelect: false,
pageSize: 10,
pageList: [5, 10, 15, 20],
fitColumns: true,
fit: true,
striped: true,
nowrap: false,
url: 'list.do',
idField:'mediaId',
columns:[[
{field:'id',checkbox:true},
{field:'system',title:'适用系统'},
{field:'infoType',title:'消息类型',
formatter:
function(value, row, index){
if(value==1)
return "文本";
if(value==2)
return "图片";
if(value==3)
return "视频";
else
return "<span style=\"color:red\" >未知</span>";
}},
{field:'title',title:'标题'},
{field:'content',title:'内容',width:140},
{field:'issueTime',title:'生效时间',
formatter:function(value,row,index){
var unixTimestamp = new Date(value);
return unixTimestamp.toLocaleString();
}
},
{field:'disabledTime',title:'失效时间'},
{field:'userId',title:'用户ID'},
{field:'userName',title:'操作员'}
]],

用这样的方式生成格式化时间和显示内容,

第二种方法,直接生成table,然后给formatter制定方法

<table id="dg" title="用户信息管理" class="easyui-datagrid" style="width:100%;height:95%"
url="/sysuser/queryAllUser"
toolbar="#toolbar" pagination="true"
rownumbers="true" fitColumns="true" singleSelect="true">
<thead>
<tr>
<th field="userId" width="50">用户编号</th>
<th field="unitName" width="50">用户单位</th>
<th field="userName" width="50">用户名字</th>
<th field="lastLoginDate" formatter="jsonTimeStamp" width="50">上次登录时间</th>
<th field="isLocked" width="50" formatter="formatlock">是否锁定</th>
</tr>
</thead>
</table>

此时的jsonTimeStamp和formatlock方法如下,将其放入html的scrpits下或者单独做一个common.js

/**
* @param value 将用户的状态信息解析为汉字状态信息
* @author lyy
* @desc 0-未锁定 1-锁定
*/
function formatlock(value){
if(value==0)
return "<span style=\"color:green\" >未锁定</span>";
else
return "<span style=\"color:red\" >锁定</span>";
}
/**
* @param milliseconds 要转换的时间豪秒数
* @author lyy
* @desc 将毫秒时间转换为2010-1-1 1:1:1这样的格式
*/
function jsonTimeStamp(milliseconds) {
if (milliseconds != "" && milliseconds != null && milliseconds != "null") {
var datetime = new Date();
datetime.setTime(milliseconds);
var year = datetime.getFullYear();
var month = datetime.getMonth() + 1 < 10 ? "0"
+ (datetime.getMonth() + 1) : datetime.getMonth() + 1;
var date = datetime.getDate() < 10 ? "0" + datetime.getDate()
: datetime.getDate();
var hour = datetime.getHours() < 10 ? "0" + datetime.getHours()
: datetime.getHours();
var minute = datetime.getMinutes() < 10 ? "0"
+ datetime.getMinutes() : datetime.getMinutes();
var second = datetime.getSeconds() < 10 ? "0"
+ datetime.getSeconds() : datetime.getSeconds();
return year + "-" + month + "-" + date + " " + hour + ":" + minute
+ ":" + second;
} else {
return "";
}
}

easy_UI datagrid view数据格式化的更多相关文章

  1. easyui数据网格视图(Datagrid View)的简单应用

    下面介绍datagrid的数据网格详细视图和数据网格的分组视图 1.先引用的js和css文件 1)包含eauyui必备的四个文件easyui.css,icon.css, jquery-min.js.j ...

  2. SpringMVC框架下数据的增删改查,数据类型转换,数据格式化,数据校验,错误输入的消息回显

    在eclipse中javaEE环境下: 这儿并没有连接数据库,而是将数据存放在map集合中: 将各种架包导入lib下... web.xml文件配置为 <?xml version="1. ...

  3. PHP json数据格式化方法

    php 的json_encode能把数组转换为json格式的字符串.字符串没有缩进,中文会转为unicode编码,例如\u975a\u4ed4.人阅读比较困难.现在这个方法在json_encode的基 ...

  4. easyui 的 DataGrid View 使用

    easyui真是后台人员的宝呀,让不会前台的程序员,不用再用那些自己看着都恶心的表格了! 今天来说说easyui datagrid 的 数据表格详细展示表格,这个有趣多了! 先上图 然后是代码 $(' ...

  5. SpringMVC(三)-- 视图和视图解析器、数据格式化标签、数据类型转换、SpringMVC处理JSON数据、文件上传

    1.视图和视图解析器 请求处理方法执行完成后,最终返回一个 ModelAndView 对象 对于那些返回 String,View 或 ModeMap 等类型的处理方法,SpringMVC 也会在内部将 ...

  6. python数据格式化之pprint

    python数据格式化之pprint 2017年06月17日 13:56:33 阅读数:2291 简介 pprint模块 提供了打印出任何Python数据结构类和方法. 模块方法: 1.class p ...

  7. SpringMVC的数据转换&&数据格式化&&数据校验

    1 SpringMVC的数据绑定流程 SpringMVC将ServletRequest对象及目标方法的入参实例传递给WebDataBinderFactory实例,以创建DataBinder实例对象. ...

  8. jQuery easyui datagrid 的数据加载

        其实easyuidatagrid加载数据只有两种方式:一种是ajax加载目标url返回的json数据:另一种是加载js对象,也就是使用loadDate方法,这种方法用于加载本地js数据(非ur ...

  9. SpringMVC 数据转换 & 数据格式化 & 数据校验

    数据绑定流程 1. Spring MVC 主框架将 ServletRequest 对象及目标方法的入参实例传递给 WebDataBinderFactory 实例,以创建 DataBinder 实例对象 ...

随机推荐

  1. 校验知识:CRC32、MD5、SHA1概念及可靠性现状

    转:http://www.metsky.com/archives/337.html 昨天介绍了Windows 7的版本识别问题,不得不提到常用的CRC32.MD5.SHA1等校验算法可靠性问题,如果只 ...

  2. JS版汉字与拼音互转终极方案,附简单的JS拼音输入法

    原文:http://www.cnblogs.com/liuxianan/p/pinyinjs.html 前言 网上关于JS实现汉字和拼音互转的文章很多,但是比较杂乱,都是互相抄来抄去,而且有的不支持多 ...

  3. mongodb聚合(转)

    聚合 是泛指各种可以处理批量记录并返回计算结果的操作.MongoDB提供了丰富的聚合操作,用于对数据集执行计算操作.在 mongod 实例上执行聚合操作可以大大简化应用的代码,并降低对资源的消耗. 聚 ...

  4. 小二助手-react.js分块加载

    小二助手在线演示地址:http://118.25.217.253:8000  账号test 密码123 小二助手是用material-ui开发的,感觉国内使用的人数不是特别多,所以创建了一个qq交流群 ...

  5. 10道典型的JavaScript面试题

    问题1: 作用域(Scope) 考虑以下代码: (function() { ; })(); console.log(b); 上述代码会打印出5.这个问题的陷阱就是,在立即执行函数表达式(IIFE)中, ...

  6. 【前端自动化构建 grunt、gulp、webpack】

    参考资料: 用自动化构建工具增强你的工作流程!:http://www.gulpjs.com.cn/ gulp详细入门教程:http://www.ydcss.com/ JavaScript构建(编绎)系 ...

  7. BUPT复试专题—解析表达式(2015)

    题目描述 输入一个字符串形式的表达式,该表达式中包括整数,四则运算符(+.-.*./),括号,三角函数(sin(x).cos(x).tan(x)),底数函数(lg(x).ln(x)),计算该表达式的值 ...

  8. 文档对象模型-DOM(二)

    从NodeList中选择元素 方法一:item()方法,用于返回其中的单一节点,需要在方法的参数中指定所需元素的索引编号. 当其中没有任何元素时,执行代码是对资源的浪费.因此程序员会在执行代码之前,先 ...

  9. C#文本框中默认是不允许使用全选的

    C#文本框中默认是不允许使用全选的.可以通过以下事件完成:  private void textBox1_KeyDown(object sender, KeyEventArgs e) {      i ...

  10. css - 小程序样式

    /* * @Author: WJ_LONG * @Date: 2018-09-15 17:25:37 * @Last Modified by: WJ_LONG * @Last Modified tim ...