近期在搞ExtJs,发现ExJs的Grid相当的强大,后来又搞Jquery时,就对原来的表格不怎么满意了,于是,花了点时间,从网上找了个Grid插件,这个插件功能是比较强大,什么行排序、筛选、分页都有,应该是能满足项目的需要。

但在深入研究时,却发现了两个问题。

1,Flexigrid不支持自定义数据列。

2,默认没有CheckBox列。

关于第一个问题,事情是这样的。

像ExtJs是先定义Store,Store中可以把所有Fields列出来,需要用到哪个,在下面的ColumnModel中声明就可以,这里可以自由组合排列,非常方便。

但Flexigrid就不行,经分析原因,是因为FlexGrid中返回的Json格式,根本就没有列名称这个字段,它只是按照顺序在界面上显示。

返回的字符串如下所示:

{"page":2,"rows":[{"cell":["66","dd"],"flexrowid":""},{"cell":["77","ee"],"flexrowid":""},{"cell":["88","sd"],"flexrowid":""},{"cell":["99","xc"],"flexrowid":""},{"cell":["10","xas"],"flexrowid":""}],"total":21}

在界面上定义显示字段时,这样定义:

                colModel: [
{ display: 'Select', name: 'id', width: 40, sortable: true, align: 'center', checkbox: true },
{ display: 'ID', name: 'Flexgrid_KeyID', width: 40, sortable: true, align: 'center' },
{ display: 'Name', name: 'name', width: 40, sortable: true, align: 'left' },
{ display: 'ISOAA', name: 'isoAA', width: 40, sortable: true, align: 'center' },
{ display: 'ISOAA', name: 'isoAA', width: 40, sortable: true, align: 'center' },
{ display: 'ISOAA', name: 'isoAA', width: 40, sortable: true, align: 'center' },
{ display: 'Printable Name', name: 'printable_name', width: 120, sortable: true, align: 'left' },
{ display: 'ISO3', name: 'iso3', width: 130, sortable: true, align: 'left', hide: false },
{ display: 'Number Code', name: 'numcode', width: 80, sortable: true, align: 'right' }
]

看到没,Name可以随便写。

效果如下:

这里就会出现一个问题,我后台的列表字段是相对固守的,假如我只需要显示中间的某些列,怎么办?

不过这个难不倒我,我想到了使用Tuple,代码这样写:

//自定义列
var tupR = (from l in list
select Tuple.Create(l.CID, l.name, l.numcode,DateTime.Now)).ToList(); string json_str_tupR = WXFlexigridHelp.FlexigridTable<Tuple<int, string, string, DateTime>>(tupR, pageindex, total, rowIdName).ToJson();

再看效果,已变成下图所示:

是不是很爽呀。

至于第二个问题,我参考网址:http://tomorrow009.iteye.com/blog/891641

很容易实现需要的效果。

Flexigrid自定义显示数据列的更多相关文章

  1. mysql数据库导出模型到powerdesigner,PDM图形窗口中显示数据列的中文注释

    1,mysql数据库导出模型到powerdesigner 2,CRL+Shift+X 3,复制以下内容,执行 '******************************************** ...

  2. 转 在PowerDesigner的PDM图形窗口中显示数据列的中文注释

    Name是名称(字段描述),Code是字段名称,Comment是注释名称,ER图中显示的是Name.一般设计时,Name跟comment都设计成描述, 而设计时候常把comment写成中文,name保 ...

  3. Silverlight中DataGrid的显示指定列、修改默认列名和格式化日期数据和小数数据

    一:DataGrid的显示指定列.修改默认列名 使用自动生成列,就会无区别的按缺省格式展示所有项目.除了bit类型,其他类型项目会以字符串形式展现. 通过设置Columns属性,可以选择性的显示列,以 ...

  4. Django 列的自定义显示

    ModelAdmin 作用:对后台数据表的显示做自定义的设置(如果对django默认的显示模式感到满意则不需要定义modeladmin).我对默认的显示模式永远不满意! 定义modeladmin: f ...

  5. DataGridView右键菜单自定义显示及隐藏列

    WinForm程序中表单的列可自定义显示及隐藏,是一种常见的功能,对于用户体验来说是非常好的.笔者经过一段时间的摸索,终于实现了自己想要的功能及效果,现记录一下过程: 1.新建一个自定义控件,命名为: ...

  6. SharePoint 2013 关于自定义显示列表表单的bug

    1.在SharePoint 2013中,我们隐藏列表Dispform页面的ListFormWebPart部件,转而使用自定义显示列表表单进行展示,因为这样更容易定制我们需要的显示: 2.之后发现文件夹 ...

  7. pentaho cde 选择性的显示多列数据

    在业务需求中,有时候会有这种需要,就是查出来可多列数据,而我只想画出来其中的一列或者说某一列,而pentaho会默认画出查出来的所有数据,而不断的更改数据源又太麻烦,这时就要用到resders方法了. ...

  8. Flexigrid在IE下不显示数据的处理

    文章总结自我的论坛提问: http://bbs.csdn.net/topics/390498434?page=1#post-394918028 解决方法: 网上的答案经我验证都是不靠谱的,以后大家就知 ...

  9. Excel导入sq server后数据列以科学计数法显示

    一.选中excel数据列如图 二.选择数据--分列 三.选择下一步,下一步,文本 四.完成 五.这样把excel导入到数据库中是以文本形式显示不会出现科学计数法

随机推荐

  1. switch..case函数的基础使用一

    基本作用:switch中的参数与case的值进行比对,相等则进入case. JDK1.7 switch支持int.Integer.String类型 package com.my.test; impor ...

  2. 你真的知道css三种存在样式(外联样式、内部样式、内联样式)的区别吗?

    css样式在html中有三种存在形态: 内联样式:<div style="display: none"></div> 内部样式: <style> ...

  3. MonoBehaviour.StopCoroutine

    MonoBehaviour.StopCoroutine Description Stops all coroutines named methodName running on this behavi ...

  4. 【redis】05Redis的常用命令及高级应用

    Redis常用命令     Redis提供了非常丰富的命令,对数据库和个中数据类型进行操作, 这些命令呢,可以在Linux终端使用. 分为两大类的命令,一种是键值相关的命令,一种是服务器相关的命令, ...

  5. java基础知识回顾之java Thread类学习(三)--java线程实现常见的两种方式实现好处:

    总结:实现Runnable接口比继承Thread类更有优势: 1.因为java只能单继承,实现Runnable接口可以避免单继承的局限性 2.继承Thread类,多个线程不能处理或者共享同一个资源,但 ...

  6. shop++ 安装

    1.安装tomcat后 ,G:\apache-tomcat-6.0.35\conf\server.xml 中设置tomcat 编码为utf-8. 增加URIEncoding = "UTF-8 ...

  7. SDUT1500 Message Flood

    以前做过的用的字典树,可是貌似现在再用超内存....求解释... 问了LYN用的map函数做的,又去小小的学了map函数.... http://wenku.baidu.com/view/0b08cec ...

  8. Android 打开闪光灯(手电筒)

    package com.example.openBackLight; import android.app.Activity; import android.hardware.Camera; impo ...

  9. 【mongoDB高级篇②】大数据聚集运算之mapReduce(映射化简)

    简述 mapReduce从字面上来理解就是两个过程:map映射以及reduce化简.是一种比较先进的大数据处理方法,其难度不高,从性能上来说属于比较暴力的(通过N台服务器同时来计算),但相较于grou ...

  10. 什么是hibernate?

    一.什么是hibernate框架?1.通过数据库保存java运行时产生的对象和恢复对象,其实就是实现java对象与关系数据库记录的映射关系称为ORM(Object Relation Mapping), ...