easyui的formatter属性可以帮助我们更加灵活的显示数据库中的数据。

比如,我有一个启用禁用字段,使用数字表示,1表示启用,2表示禁用,展示给客户的时候我当然希望是中文的形式。

只需要写这么一个formatter方法:(isu就是这个字段)

function formatterIsu(value, row, index){
if(row.isu==1){
return "启用";
}else if(row.isu==2){
return "禁用";
}
}

然后在<th>标签里的将这个函数赋值给formatter属性:

最后页面上输出的就是中文的启用,禁用了。

很多时候,创建表格头也是通过js来完成,里面也是可以加入formatter函数来格式化字段的:

$(document).ready(function() {
$('#dg').datagrid({
url : "/bboo/resource/gj-resource!queryResource.do",
columns : [ [ {
field : 'resourceId',
title : '菜单id',
width : 50,
sortable : true
}, {
field : 'description',
title : '描述',
width : 50,
sortable : true
}, {
field : 'name',
title : '名称',
width : 50,
sortable : true
}, {
field : 'sort',
title : '分类',
width : 50,
sortable : true
}, {
field : 'type',
title : '类型',
width : 50,
sortable : true
}, {
field : 'value',
title : 'url值',
width : 50,
sortable : true
}, {
field : 'pid',
title : '父菜单',
width : 80,
formatter : function(value, row, index) {
if (row.parent) {
return row.parent.resourceId;
} else {
return value;
}
}
} ] ]
});
});

上面的pid字段就是格式化后的数据。

EasyUI datagrid formatter 属性的更多相关文章

  1. EasyUI DataGrid formatter 格式化增加链接

            function fLoadTable() {             $('#tt').datagrid({                 title: '',           ...

  2. JQuery EasyUI DataGrid 获取属性值

    在Jquery EasyUI中返回操作的时候,根据当前页返回到数据选取页: var grid = $('#datagrid'); var options = grid.datagrid('getPag ...

  3. easyui datagrid fit 属性

    fit:true - 自适应大小,填充容器 fitColumns:true - 自动使列适应表格宽度以防止出现水平滚动.

  4. Jquery easyUI datagrid载入复杂JSON数据方法

    1.JSON数据为: {     "total":28, "rows": [     {       "itemNo": "1&q ...

  5. easyui datagrid 动态添加columns属性

    公司在项目设计的时候,有一个需求,就是查出来的表的字段不唯一,一张表的字段可能是三个,也可能是五个,但是却要把它显示到页面,这个给我做ui的带来一点麻烦.因为以前一般用easyui 的datagrid ...

  6. 数据网格和树-EasyUI Datagrid 数据网格、EasyUI Propertygrid 属性网格、EasyUI Tree 树、EasyUI Treegrid 树形网格

    EasyUI Datagrid 数据网格 扩展自 $.fn.panel.defaults.通过 $.fn.datagrid.defaults 重写默认的 defaults. 数据网格(datagrid ...

  7. 在easyui datagrid中formatter数据后使用linkbutton

    http://ntzrj513.blog.163.com/blog/static/2794561220139245411997/ formatter:function(value,rowData,ro ...

  8. EasyUI DataGrid定制默认属性名称

    EasyUI DataGrid绑定服务器返回Json数据的解决方案 1. 服务器返回的数据对象格式,及初始化返回值 public class RequestResult { private int c ...

  9. EasyUI DataGrid 中字段 formatter 格式化不起作用

    今天用 EasyUI datagrid 来做列表,要对一些数据进行格式化,推断某字段状态时,发现 formatter 格式化相应的函数不起作用. <table id="list_dat ...

随机推荐

  1. 痞子衡嵌入式:ARM Cortex-M文件那些事(6)- 可执行文件(.out/.elf)

    大家好,我是痞子衡,是正经搞技术的痞子.今天痞子衡给大家讲的是嵌入式开发里的executable文件(elf). 第四.五节课里,痞子衡已经给大家介绍了2种output文件,本文继续给大家讲proje ...

  2. MariaDB官方手册翻译

    MariaDB官方手册 翻译:create database语句(已提交到MariaDB官方手册) 翻译:rename table语句(已提交到MariaDB官方手册) 翻译:alter table语 ...

  3. Redux进阶(像VUEX一样使用Redux)

    更好的阅度体验 前言 redux的问题 方案目标 如何实现 思考 前言 Redux是一个非常实用的状态管理库,对于大多数使用React库的开发者来说,Redux都是会接触到的.在使用Redux享受其带 ...

  4. 第21章 登录 - Identity Server 4 中文文档(v1.0.0)

    为了使IdentityServer能够代表用户发出令牌,该用户必须登录IdentityServer. 21.1 Cookie身份验证 使用由ASP.NET Core中的cookie身份验证处理程序管理 ...

  5. Android破解学习之路(八)—— 进化之地内购破解

    最近在TapTap闲逛,看到了进化之地这款游戏,TapTap上有两个进化之地,一个是在TapTap直接购买的,另外一个则是试玩版,玩到中间就会有个购买完整版. 试玩版连接:https://www.ta ...

  6. ecstore 安装后提示require function does not exist in....

    解决: 安装好后,修改config.php里的TMP_DIR,指向网站目录下的data目录(用绝对路径) // define('TMP_DIR', '/data/www/data/tmp/');  先 ...

  7. vue中如何使用mockjs摸拟接口的各种数据

    mockjs的作用 生成模拟数据 模拟 Ajax 请求,返回模拟数据 基于 HTML 模板生成模拟数据(后续更新) 帮助编写单元测试(后续更新) Vue 中使用 mock 有两种使用方式,一种是仅编写 ...

  8. vue px转换为rem

    前端开发中还原设计图的重要性毋庸置疑,目前来说应用最多的应该也还是使用rem.然而很多人依然还是处于刀耕火种的时代,要么自己去计算rem值,要么依靠编辑器安装插件转换. 而本文的目标就是通过一系列的配 ...

  9. Object.keys 及表单清空

    Object.keys 返回一个所有元素为字符串的数组,其元素来自于从给定的object上面可直接枚举的属性.这些属性的顺序与手动遍历该对象属性时的一致. // simple array var ar ...

  10. [伟哥开源项目基金会](https://github.com/AspNetCoreFoundation)

    伟哥开源项目基金会 GitHub_base=> 伟哥开源项目基金会 该项目作者为伟哥,GitHub地址:https://github.com/amh1979: 该项目维护者为鸟窝,GitHub地 ...