JQuery Flexigrid 是一个不错的table插件,给大家介绍一下
1.官网
http://flexigrid.info/
2.优势
支持主流的table功能,简单实用,学习周期短,是一个不错的table插件
3.实践
先书写HTML
<table class="flexme1"> <thead> <tr> <th width="100">Col 1</th> <th width="100">Col 2</th> <th width="100">Col 3 is a long header name</th> <th width="300">Col 4</th> </tr> </thead> <tbody> <tr><td>This is data 1 with overflowing content</td><td>This is data 2</td><td>This is data 3</td><td>This is data 4</td></tr> <tr><td>This is data 1</td><td>This is data 2</td><td>This is data 3</td><td>This is data 4</td></tr> <tr><td>This is data 1</td><td>This is data 2</td><td>This is data 3</td><td>This is data 4</td></tr> <tr><td>This is data 1</td><td>This is data 2</td><td>This is data 3</td><td>This is data 4</td></tr> <tr><td>This is data 1</td><td>This is data 2</td><td>This is data 3</td><td>This is data 4</td></tr> <tr><td>This is data 1</td><td>This is data 2</td><td>This is data 3</td><td>This is data 4</td></tr> <tr><td>This is data 1</td><td>This is data 2</td><td>This is data 3</td><td>This is data 4</td></tr> </tbody> </table>
然后添加变为奇迹代码
$('.flexme1').flexigrid();
就好了
下面就是我这篇文章的重点
说一说Flexigrid的JSON API
好了 哈哈,希望对你们有帮助
参考:http://blog.cuegraphix.com/?p=86
基本设定 |
|
||||||||||||||||||||||||||||||||||||||||||
Ajax设定 |
|
||||||||||||||||||||||||||||||||||||||||||
其他 | 1.colModel 列信息
display 显示信息 name 名字 width 宽度 sortable 是否可排序 align 居中状态 hide 是否隐藏 2.searchitems 检索信息 display 显示信息 name 名字 isdefault 默认显示 3.buttons Toolbar信息 name 名字 bclass css onpress 点击事件 4.onToggleCol 列变更事件 5.onChangeSort 排序变更的事件 6.onSuccess 表示成功的事件 7.onSubmit 提交的事件 8. preProcess 数据处理的事件 |
相关推荐
jquery flexigrid;jquery flexigrid
jquery flexigrid与jquery tablesort 配合实现flexigrid的客户端排序功能。jsp项目,无需数据库即可运行
Jquery FlexiGrid JS 前后台数据的传值、对象 前台使用FlexiGrid 插件显示数据条数 注意:action层变量名对应
$("#flex1").flexigrid({ url: 'post2.php', dataType: 'json', colModel : [ {display: 'ISO', name : 'iso', width : 40, sortable : true, align: 'center'}, {display: 'Name', name : 'name', width : 180...
jquery flexigrid 与asp.net 的交互,并实现了crud 。提供了sqlserer oracle 等数据库的操作。
struts2.1.6+spring+hibernate+jquery+flexigrid+thickbox+mysql Struts2返回Json类型,分页显示在flexigrid表中 下载后进行评价获得积分:评价时要选择五角星才能获取积分,不然分数还是会被扣除
Jquery flexigrid插件 添加了checkbox,将它设置为true就OK了 (双击事件)onRowDblclick。。。 附带属性说明 共享下。。。。。
Flexigrid-Web2.0 jQuery表格插件 Flexigrid 是一个轻量级的Web2.0 jQuery插件。它包含很多非常Cool的特性,如主题定制、分页、工具栏、搜索、排序、ajax读取数据源、调整列宽高尺寸等。 一个中文实例教程: ...
JQuery_插件FlexiGrid_之完全配置与使用
jquery+flexigrid使用方法.pdfjquery+flexigrid使用方法.pdf
这个控件是jquery封装的一款控件,最初的时候里面东西很少.只是用来显示数据使用的, 传输数据的格式有两种 xml 和 json ,做系统网站上比较用的多, 这个控件也比较好看和实用, 我在网上看到了很多功能但是都很散, 我...
最近项目要用jquery开发,于是打算用flexigrid做表格功能,但是遇到了数据不能显示、IE下显示等问题(在FF下显示正常)。于是花了2个小时时间对flexigrid.pack.js进行调试,经过苦闷的两个小时后,皇天不负有心人,...
jquery表格插件Flexigrid 将数据按照表格排列,类似与ext。
NULL 博文链接:https://piziwang.iteye.com/blog/537636
NULL 博文链接:https://gundumw100.iteye.com/blog/531131
资源名称:Jquery flexigrid使用 中文WORD版内容简介:本文档主要讲述的是Jquery flexigrid使用;使用技术:struts2.1.6 spring hibernate jquery flexigrid thickbox mysql;主要的js文件:jquery.js,flexigrid.js,...
NULL 博文链接:https://zhy6599.iteye.com/blog/1098301
这是介绍JQuery表格插件FlexiGrid在Java中的使用,使用Servlet进行开发,json传递数据
jquery 表格插件 Flexigrid
CodeIgniter 2.2 使用 jQuery Flexigrid 实现稳定 演示 安装 使用的数据库可用作存储库中“database_backup”文件夹中的 SQL 转储。 学分 向原作者致敬, 执照 麻省理工学院许可证 (MIT) 版权所有 (c) 2014 ...