整理了12款Javascript 表格控件(DataGrid)

所属分类: 网页制作 / 应用技巧 阅读数: 1973
收藏 0 赞 0 分享
当在设计时设置了DataGrid 控件的 DataSource 属性后,就会用数据源的记录集来自动填充该控件,以及自动设置该控件的列标头。然后您就可以编辑该网格的列;删除、重新安排、添加列标头、或者调整任意一列的宽度。

1. Flexigrid

Flexigrid

Flexigrid是一个类似于Ext Gird,但基于jQuery开发的Grid。它具有的功能包括:可以调整列宽,合并列标题,分页,排序,显示/隐藏表格等。Flexigrid显示的数据能够通过Ajax获取或者从一个普通的表格转换。

2. Yahoo! UI Library: DataTable (演示地址)

Yahoo! UI Library: DataTable

该DataTable控件提供的功能有:排序、列宽调整、分页、inline editing、row selection等。

3. jqGrid

jqGrid

jqGrid是一个Ajaxed jQuery Grid插件。提供分页功能,添加、编辑、删除和搜索表中记录,支持多种数据类型输入:XML,JSON,Array等,多行选择,支持子表格,集成日期选择控件等等。

4. tableFormSynch (演示地址)

tableFormSynch是一个表格与表单数据相互更新的jQuery插件。它提供的功能包括:基于表单中的数据,新增行。删除所选择行,并清除表单中的所有数据。tableFormSynch支持所有表单控件包括:checkboxes、radio、buttons、select

5. DataTables

DataTables

DataTables是一个jQuery插件,能够让HTML表格很方便地实现分页、过滤和多栏排序等功能。DataTables可以使用本身自带的CSS样式,但还可以按自己的需要自定义CSS样式。它具有以下特征:

  • 自适应栏宽
  • 可保存表格状态
  • 可隐含列
  • 动态创建表格
  • Ajax自动装载数据
  • 丰富的分页类型
  • 多栏排序和高亮显示

6. OmniGrid

OmniGrid

OmniGrid是一个采用Mootools1.2开发的表格控件与FlexGrid jQuery和SortableTable相似。具有分页,排序,Ajax数据加载,添加/修改/删除表格数据功能等。

7. moodgets Grid (演示地址)

moodgets Grid

moodgets Grid是一个基于Mootools框架开发,易于使用,可扩展的表格控件。拖动调整表格列宽,排序,多行或单行选择,单击表格单元格可编辑,分页,通过Ajax加载数据。

8. MyTableGrid (演示地址)

MyTableGrid

MyTableGrid是一个基于是Prototype框架开发的DataGrid控件,用于以一种更易于浏览和更灵活的方式来展示数据。它提供Ajax支持的快速分页和数据排序功能,可以拖动调整数据列宽度,隐藏不需要显示的列。

9. GT-Grid

GT-Grid

国内一个为打造成为GT-Grid成为世界级的列表组件,方便支持多种应用。可以纯客户端应用,也可以选择内置JAVA服务端作为其服户端。

10. obout v3 Grid for ASP.NET

obout v3 Grid for ASP.NET

速度比较快的Asp.net Grid。它的卓越表示在于:百万级别数据记录加载只用1秒

11. Table widget (演示地址)

Table widget

这个控件能够将正常的HTML Table转成可排序,固定表头的Table。

12. jExpand (演示地址)

jExpand

jExpand是一个可以让表格具备可伸缩功能的jQuery插件。利用这个功能可以帮助你更好地组织表格,让表格承载更多的消息比如图片,列表,图表和其它元素。

更多精彩内容其他人还在看

CSS中浏览器对尺寸和宽高解释差异的解决方法

不同的浏览器对margin、padding、height、width 等属性的解释有很大的偏差。有时我们发现同样的两列布局,在不同的浏览器中两列长短不一,类似的情况太多了,如此困扰大家的麻烦,如何解决?
收藏 0 赞 0 分享

网页变灰的笔记 细节问题处理

grayscale.js这个文件是用来兼容各个浏览器的,在一般情况下,使用它绝对不会有问题,但是在实际的操作中,还是遇到了一些麻烦。
收藏 0 赞 0 分享

页面中marquee与flash同时存在时的冲突解决方案

冲突的症状主要表现在FLASH按钮一直跳动,不稳定,影响网页美观及正常访问。
收藏 0 赞 0 分享

提高网站访问速度的六种方法

以下6种优化方法都是前端的,前端优化的意义在于减少http请求,减少网站前端程序组成的体积。
收藏 0 赞 0 分享

新鲜出炉的有用图标集25组 国外下载

恰当的图标(ICON)能使网站更具活力 曾几何时,现在的网站图标大同小异,我们的眼睛早已见惯不惊。于是,这里收集了25套专业设计的全新的图标集,希望对你有用!
收藏 0 赞 0 分享

新手建站教程 十天学会做网站

十天学会做网站教程采用最通俗易懂的语言、从最基本的开始,带领大家开始建站。教程由许耀鹏历时半年时间写成。是非常好的新手建站入门教程。
收藏 0 赞 0 分享

新手建站入门教程 建站需要的条件和工具

很多新手在论坛都会说,我从来没做过网站,做网站需要些什么条件啊,会不会很难啊?
收藏 0 赞 0 分享

新手建站入门教程 域名的解析与绑定

昨天我们讲到了建立一个属于自己的网站需要的条件和工具,里面讲到首先需要注册一个属于自己的域名,和需要购买一个虚拟主机。(详情请看:新手建站第一帖:建站需要的条件和工具)
收藏 0 赞 0 分享

新手建站入门教程③ 别名(CNAME)记录和URL转发

在上一帖中为大家介绍了域名的解析和A记录解析的方法,今天我就为大家讲解一下另一种解析方法:别名(CNAME)记录。同时为大家讲解下URL转发的好处和方法。
收藏 0 赞 0 分享

新手建站入门教程④:如何绑定子目录

去买空间的时候,我想很多朋友都已经注意到了,有的空间介绍上会有类似于“支持绑定1个子目录”、“赠送1个子目录”等词。那么这些介绍是什么意思呢?
收藏 0 赞 0 分享
查看更多