jquery的tree table(树表)
因项目需要,需要在表格中加入tree,使用了jquery的tree table,经美化,完美兼容各种框架的table;
请移步下载tree table 的js文件及css文件等,http://ludo.cubicphuse.nl/jquery-treetable/;
用到css文件:<link rel="stylesheet" href="../../style/jquery.treetable.css">
<link rel="stylesheet" href="../../style/jquery.treetable.theme.default.css">
用到js文件:<script src="../../js/jquery-1.10.1.min.js"></script>
<script src="../../js/bootstrap-treeview.min.js"></script>
使用示例:
<table id="tableId">
<tr data-tt-id="1">
<td>Parent</td>
</tr>
<tr data-tt-id="2" data-tt-parent-id="1">
<td>Child</td>
</tr>
</table>
data-tt-id为2的tr 通过data-tt-parent-id指向1节点,意思就是第二个tr是第一个tr的子节点;
一行js搞定,$("#tableId).treetable({expandable : true});
层级复杂的表格通过后台递归查询查出数据list后,可以通过判断该节点是否具有父节点来给tr增加parent_id,看示例:
var trArr = $("#tableId tr");
for (var i = 0; i < trArr.length; i++) {
$("#tableId tr:eq(" + i + ")").attr(
"data-tt-id", tabledate[i].orgId);
if (tabledate[i].parentOrg != '') {
$("#tableIdtr:eq(" + i + ")").attr(
"data-tt-parent-id", tabledate[i].parentOrg);
}
}
jquery的tree table(树表)的更多相关文章
- 查找算法(5)--Tree table lookup--树表查找
1.树表查找 (1) 最简单的树表查找算法——二叉树查找算法. [1]基本思想:二叉查找树是先对待查找的数据进行生成树,确保树的左分支的值小于右分支的值,然后在就行和每个节点的父节点比较大小,查找最适 ...
- C#结合Jquery LigerUI Tree插件构造树
Jquery LigerUI Tree是Jquery LigerUI()的插件之一,使用它可以快速的构建树形菜单.呵呵 废话不说了,直入正题,下面介绍C#结合ligerui 构造树形菜单的两种方法 1 ...
- Fancytree Javascript Tree TreeTable 树介绍和使用
Fancytree是一个非常棒的Javascript控件,功能强大,文档健全.在做Javascript Tree控件选型时,主要基于以下几点选择了Fancytree 在Javascript Tree控 ...
- 使用jQuery,实现完美的表单异步提交
jQuery异步提交表单 <form id="form1" method="post"> <table border="1" ...
- Mysql存储引擎之TokuDB以及它的数据结构Fractal tree(分形树)
在目前的Mysql数据库中,使用最广泛的是innodb存储引擎.innodb确实是个很不错的存储引擎,就连高性能Mysql里都说了,如果不是有什么很特别的要求,innodb就是最好的选择.当然,这偏文 ...
- poj 3321:Apple Tree(树状数组,提高题)
Apple Tree Time Limit: 2000MS Memory Limit: 65536K Total Submissions: 18623 Accepted: 5629 Descr ...
- Jquery easyui tree的使用
这个ui用的一切都是json数据.树也是如此! 后台需要返回与格式匹配的json数据才能正确加载树. 页面定义一个ui: <ul id="messageInfoAddTree" ...
- ext树表
aaarticlea/png;base64,iVBORw0KGgoAAAANSUhEUgAAA2UAAAHwCAIAAACpIFDdAAAgAElEQVR4nOy9f5Qb5ZnvWWQZlnO5Oc ...
- jquery实现ajax提交form表单的方法总结
本篇文章主要是对jquery实现ajax提交form表单的方法进行了总结介绍,需要的朋友可以过来参考下,希望对大家有所帮助 方法一: function AddHandlingFeeToRefund( ...
随机推荐
- Poj(1274),二分图匹配
题目链接:http://poj.org/problem?id=1274 The Perfect Stall Time Limit: 1000MS Memory Limit: 10000K Tota ...
- Poj(1459),最大流,EK算法
题目链接:http://poj.org/problem?id=1459 Power Network Time Limit: 2000MS Memory Limit: 32768K Total Su ...
- Android图形系统之Surface、SurfaceView、SurfaceHolder及SurfaceHolder.Callback之间的联系
1.Surface Surface extends Objectimplements Parcelable java.lang.Object ↳ android.view.Surface Cla ...
- 2016年10月22日 星期六 --出埃及记 Exodus 19:6
2016年10月22日 星期六 --出埃及记 Exodus 19:6 you will be for me a kingdom of priests and a holy nation.' These ...
- P1119 灾后重建
题目背景 B地区在地震过后,所有村庄都造成了一定的损毁,而这场地震却没对公路造成什么影响.但是在村庄重建好之前,所有与未重建完成的村庄的公路均无法通车.换句话说,只有连接着两个重建完成的村庄的公路才能 ...
- Java程序员必备的6款最佳开发工具
工欲善其事,必先利其器.每一个Java程序员都有其惯用的工具组件.对于Java程序员,各种有用的软件和工具泛滥成灾.初级开发人员要么找不到合适的工具,要么在寻找过程中浪费了大量的时间.下面,我将为大家 ...
- 在Window Embedded CE(Wince)下使用OpenNETCF进行路由表的开发
点击打开链接 背景 在开发3G项目的是时候,发现尽管3G网络连接已经建立成功了,但是数据不能发送成功,查明原因,由于路由表的问题,导致数据往ActiveSync连接的对端,也就是PC发送,而不是发送到 ...
- 长链非编码RNA(lncRNA)
长链非编码RNA(lncRNA) 转自:http://blog.sina.com.cn/s/blog_909da11301010bkz.html 长链非编码RNA(lncRNA)是一类转录本长 ...
- [Gym]2008-2009 ACM-ICPC, NEERC, Moscow Subregional Contest
比赛链接:http://codeforces.com/gym/100861 A模拟,注意两个特殊的缩写. #include <bits/stdc++.h> using namespace ...
- Jenkins-CVE-2016-0792漏洞利用及修复建议
漏洞概述: 国外网站 Contrast Security 于2016年2月24日在公开了Jenkins近日修复的一个可通过低权限用户调用 API 服务致使的命令执行漏洞详情.通过低权限用户构造一个恶意 ...