低调人
2016-02-17 13:58:24
原证精
jquery表格插件:zyTable,配置超方便、体验超棒的js表格组件
各位观众老爷们,今天小弟再次分享自己开发的zyTable表格插件,此插件支持删除、编辑、分页、自定义列宽、序号等各种功能,并且用户体验、配置超超超超超超超简单、使用方便,真乃居家必备之利器啊~
先给大家看一下大家闺秀的模样
再看一下编辑状态:
接下来介绍一些初始化代码:
// 初始化插件 $(".table").table({ "width" : 500, "height" : 250, "field" : [{"id":"ID", "name":"ID", "width":80},{"id":"NAME", "name":"名字", "width":120},{"id":"AGE", "name":"年龄", "width":70}], "adaptive" : false, // 数据源字段自适应宽度方式 "pattern" : false, // 模式 true:字段方式获取数据 false:普通添加方式获取数据 "example" : false, // 实例 当前创建的是否是model中的实例 "check" : true, // 全选 "number" : true, // 序号 "edit" : true, // 编辑 "del" : true, // 删除 "allDel" : true, // 全部删除 "filter" : true, // 过滤 "paging" : true, // 分页条 "zebra" : true, // 斑马线 "dataTotal" : 30, // 数据总个数 "rowsPerPage": 10, // 一页多少行数据 "pagingComplete": function(nNowPage){ // 翻页的回调方法 console.info("用户定义翻页回调:"); console.info(nNowPage); // 翻页添加数据 var data = []; for(var i=nNowPage*10+1; i<=nNowPage*10+10; i++){ if(i!=nNowPage*10+10){ data.push({"ID":"000"+i,"NAME":"张三"+i+"号","AGE":(20+i)+"岁"}); }else{ data.push({"ID":"000"+i,"NAME":"张三"+i+"号","AGE":(20+i)+"岁"}); } } $(".table").table("addData", data); }, "delComplete": function(aRowId){ // 删除数据的回调方法 console.info("用户定义删除回调:"); console.info(aRowId); }, "editComplete": function(afterData, beforeData){ // 编辑数据的回调方法 console.info("用户定义编辑回调:"); console.info(afterData); console.info(beforeData); } }); // 初始化添加数据 var data = []; for(var i=1; i<=10; i++){ if(i!=10){ data.push({"ID":"000"+i,"NAME":"张三"+i+"号","AGE":(20+i)+"岁"}); }else{ data.push({"ID":"000"+i,"NAME":"张三"+i+"号","AGE":(20+i)+"岁"}); } } $(".table").table("addData", data);
猜你喜欢
- jquery表格插件jquery.table.tr.js技术实现动态置顶、置底、上移、下移
- 小白使用jquery插件jquery.table2excel.js快速实现表格数据导出到excel功能(超级简单)
- jquery easyUi组件开发数据表格,属性表格
- jQuery开源表格树插件-TreeGrid
- jquery表格导出插件jquerytableExport实现导出jqueryeasyui和bootstrap的表格为Excel和pdf文档的详细实例
- jquery点击表头实现表格排序插件下载
- jquery表格插件jquery.dataTables.js使用实例
- jquery开发分页插件下载
- jquery插件treetable开发完美树状表格DEMO
- 十分给力jquery插件miniui框架整合java实现各种图形报表管理系统
- jquery开发弹出遮罩窗口的插件jquery-colorbox特效代码下载
- jQuery分页插件特效代码
请下载代码后再发表评论
文件名:zyTable实例代码.zip,文件大小:193.761K
下载
- /
- /zyTable
- /zyTable/css
- /zyTable/css/table.css
- /zyTable/demo.html
- /zyTable/js
- /zyTable/js/jquery-1.7.2.js
- /zyTable/js/table.js
- /zyTable/plugs
- /zyTable/plugs/bootstrap-ui
- /zyTable/plugs/bootstrap-ui/css
- /zyTable/plugs/bootstrap-ui/css
- /zyTable/plugs/bootstrap-ui
- /zyTable/css
- /zyTable

- 证 jquery生成图片验证码
- 原证 jquery编写的alert弹窗插件带模式化窗口,支持$.alert({参数})语法,支持拖拽
- 证 jquery实现鼠标移动到图片上缩小图片并显示图片说明特效源代码下载
- 证精 sina微博表情插件源码下载(jquery)
- 精心挑选的22款精美jquery特效
- Ajax+JQuery留言特效
- 证 分享一个jquery的分页插件代码
- 证 jQuery/CSS3实现拼图效果的相册插件
- Jquery超酷的日,周,月日程安排插件源码分享
- 证 jquery简单mp3在线音乐播放器
- 证 Jquery实现QWERTY软键盘插件
- 证 jquery特效集锦 包含多种插件展示效果

511076827 LV33
2022年4月21日
cnfreerwow LV2
2022年1月9日
ppooppoo932 LV4
2021年1月7日
yale1422688399 LV3
2020年5月29日
dayuln LV8
2020年3月2日
myjzb111 LV9
2019年12月7日
xuyongff LV24
2019年11月4日
songtao520 LV17
2019年9月29日
Java基础入门 LV12
2019年7月3日
z2482130090 LV9
2019年7月3日

lingtiejing LV15
2023年6月25日
173745830 LV11
2023年2月1日
lonhjk LV4
2023年1月14日
wujiahua LV3
2022年12月13日
qwqw900619 LV4
2022年7月16日
海阔天空666 LV7
2022年7月6日
yyy1121 LV2
2022年5月24日
511076827 LV33
2022年4月21日
xiazai119 LV1
2022年3月5日
Gaodaima LV6
2022年2月24日