文档章节

js实现漂亮表格+分页排序功能

lgscofield
 lgscofield
发布于 2015/06/26 13:58
字数 271
阅读 20
收藏 0

TinyTable JavaScript Table Sorter

This updated table sorter script is easy to use and feature packed at only 2.5KB. New features include column highlighting, optional pagination, support for links, and date/link parsing. A few other features are alternate row highlighting, header class toggling, auto data type recognition and selective column sorting. More updates will follow soon.

To initialize a table sorter follow the pattern below:

1
2
3
4
5
6
7
8
9
10
11
12
13
var sorter = new TINY.table.sorter( 'sorter' );
sorter.head = 'head' ; //header class name
sorter.asc = 'asc' ; //ascending header class name
sorter.desc = 'desc' ; //descending header class name
sorter.even = 'evenrow' ; //even row class name
sorter.odd = 'oddrow' ; //odd row class name
sorter.evensel = 'evenselected' ; //selected column even class
sorter.oddsel = 'oddselected' ; //selected column odd class
sorter.paginate = true ( false ); //toggle for pagination logic
sorter.pagesize = 15 (20); //toggle for pagination logic
sorter.currentid = 'currentpage' ; //current page id
sorter.limitid = 'pagelimit' ; //page limit id
sorter.init( 'table' ,1);

Before initialization, a new table sorter object must be created. The parameter taken by TINY.table.sorter is the variable name used for the object. The object.init function takes 2 parameters: the id of the table and the initially sorted column index (optional). If you want to exclude a column from sorting add class=”nosort” to the appropriate table header. Table styling is completely customizable via the CSS.

This script has been tested in all major browsers and is available free of charge for both personal or commercial projects under the creative commons license. Community support is available here. Paid support is also available, contact me for details.

本文转载自:http://lgscofield.iteye.com/blog/1676277

共有 人打赏支持
lgscofield

lgscofield

粉丝 22
博文 140
码字总数 63036
作品 0
南京
架构师
私信 提问
13 个最佳 JavaScript 数据表格库

JavaScript 是一种通常被用在网页开发中的编程语言。它主要是在互联网上的网页浏览器中开发出效果出众且可交互的特效。它是客户端脚本语言中的一种,是被用来作为通过用户的网页浏览器进行处...

oschina
2017/03/10
5K
7
7款强大的Javascript网格插件推荐

表格一直是展示数据的最好方式。以微软的Excel为例,我们可以排序、整理、编辑,甚至几次点击轻松过滤数据。这次,我们看一看JavaScript网格插件,利用JS应用,它转换成普通表到“类Excel”布...

老枪
2011/03/31
6.5K
8
Datatables快速入门开发--一款好用的JQuery表格插件

  博主是一个java后端程序员,前端技术会用但不精通,做后台的一些功能经常要涉及表格的展示,分页,搜索,排序等等一系列功能,在经历了一段时间的原始手段,开始接触并使用Datatables,一个jquer...

冬至饮雪
2017/08/04
0
0
Sigma Grid数据表格

Sigma Grid 是一个基于 Ajax 的数据表格,用以显示滚动的表格以及进行单元格数据的在线编辑,支持各种流行的浏览器,提供服务器端的集成解决方案,包括 PHP、Java、.NET 和 Perl。主要功能包...

wanganf
2012/02/29
0
0
推荐十个最新免费的 jQuery 表格插件

作为开发者都知道插件的重要性,有了插件的帮助,工作会更加高效。这次,我们收集了一些优秀的 jQuery 表格插件介绍给大家。 创建一个表格(table)并调整其规模,是一项艰难而繁琐的工作。作...

oschina
2015/06/10
38.6K
10

没有更多内容

加载失败,请刷新页面

加载更多

Yearning基于Inception的开源SQL审核平台

基础环境: python3 nodejs vuejs mysql python-ldap pymysql mysql 新建数据库 create database Yearning DEFAULT CHARACTER SET utf8 COLLATE utf8_general_ci; Navicat导入初始化数据 : ......

以谁为师
11分钟前
0
0
flutter Expanded用法

使用的地方:一个分类,类似京东的,左右两边都可以滑动 Widget build(BuildContext context) { return Row(children: [ Column( children: <Widget>[ Ex......

大灰狼wow
16分钟前
2
0
Java8 Map中新增的方法使用总结

前言 得益于 Java 8 的 default 方法特性,Java 8 对 Map 增加了不少实用的默认方法,像 getOrDefault, forEach, replace, replaceAll, putIfAbsent, remove(key, value), computeIfPresent,......

kaixin_code
25分钟前
1
0
@TransactionConfiguration

@TransactionConfiguration过时与替代写法 @TransactionConfiguration 替代写法

miaojiangmin
28分钟前
0
0
浅谈Vue响应式(数组变异方法)

很多初使用Vue的同学会发现,在改变数组的值的时候,值确实是改变了,但是视图却无动于衷,果然是因为数组太高冷了吗? 查看官方文档才发现,不是女神太高冷,而是你没用对方法。 看来想让女...

开元中国2015
29分钟前
2
0

没有更多内容

加载失败,请刷新页面

加载更多

返回顶部
顶部