下载后treetable插件后只需要保留jquery.treetable.css样式文件,jquery.treetable.theme.default.css皮肤文件和jquery.treetable.js库,在页面上引用后初始化

  $("#treeTable").treetable({ expandable: true });

  expandable为true ,初始化展开显示

  先上局部视图改造后的代码,

@model List<Org>

@helper RenderTable(Org org, List<Org> source)
{
<tr data-tt-id="@org.ID" data-tt-parent-id="@org.ParentID">
<td>
<span class="folder">@org.Name</span>@((org.AreaType == 1) ? "(镜头组)" : "")
</td>
<td class="text-center">
<a href="#" onclick="edit(false,'@org.ID')"><span class="glyphicon glyphicon-edit"></span></a>
&nbsp;
@if (org.ParentID != "0" && source.Count(m => m.ParentID == org.ID) <= 0)
{
<a href="#" onclick="del('@org.ID','@org.Name')"><span class="glyphicon glyphicon-trash"></span></a>
<i>&nbsp;</i>
}
@if (org.AreaType != 1)
{
<a href="#" onclick="edit(true,'@org.ID')"><span class="glyphicon glyphicon-plus"></span></a>
}
</td>
</tr> if (source.Count(m => m.ParentID == org.ID) > 0)
{
foreach (var item in source.Where(m => m.ParentID == org.ID).ToList())
{
@RenderTable(item, source);
}
}
} <table class="table table-bordered table-striped" id="treeTable">
<thead>
<tr>
<th width="80%">编号</th>
<th class="text-center">操作</th>
</tr>
</thead>
<tbody>
@if (null != Model && Model.Any())
{
foreach (var item in Model.Where(m => m.ParentID == "0").ToList())
{
@RenderTable(item, Model)
}
}
</tbody>
</table>

  之前同事写的嵌套几层循环,每层循环内判断,改造后在页面里定义输出方法递归调用,显示效果跟之前同事写的一样,看看效果

jquery插件treetable使用的更多相关文章

  1. 原创jquery插件treeTable(转)

    由于工作需要,要直观的看到某个业务是由那些子业务引起的异常,所以我需要用树表的方式来展现各个层次的数据. 需求: 1.数据层次分明: 2.数据读取慢.需要动态加载孩子节点: 3.支持默认展开多少层. ...

  2. 【最新】2015年7月之15个最新jQuery插件

    Hello,一个激动人心的好消息,现在我为大家整理最近7月发布的jQuery插件. 如果你熟悉任何下面列出的插件,请分享你的反馈与我们的读者,或如果你知道哪一个我们没有收录,那么请与我们分享在下面的评 ...

  3. 自己写jquery插件之模版插件高级篇(一)

    需求场景 最近项目改版中,发现很多地方有这样一个操作(见下图gif动画演示),很多地方都有用到.这里不讨论它的用户体验怎么样. 仅仅是从复用的角度,如果每个页面都去写text和select元素,两个b ...

  4. JQuery插件定义

    一:导言 有些WEB开发者,会引用一个JQuery类库,然后在网页上写一写$("#"),$("."),写了几年就对别人说非常熟悉JQuery.我曾经也是这样的人 ...

  5. BootStrap_04之jQuery插件(导航、轮播)、以及Less

    1.列偏移与列排序: ①列偏移:控制列出现的位置,某列偏移后,后序列会随之偏移--只能右偏移: col-lg/md/sm/xs-offset-*; ②列排序:控制某一列的位置,该列可以左(pull)右 ...

  6. 锋利的jQuery--编写jQuery插件(读书笔记五)[完结篇]

    1.表单验证插件Validation   2.表单插件Form   3.动态事件绑定插件livequery 可以为后来的元素绑定事件   类似于jQuery中的live()方法     4.jQuer ...

  7. 2016年6月份那些最实用的 jQuery 插件专辑

    jQuery 是一个快速.流行的 JavaScript 库,jQuery 用于文档处理.事件处理.动画和 Ajax 交互非常简单,学习曲线也很平坦.2016年6月的 jQuery 插件专辑里,我们选择 ...

  8. 教你开发jQuery插件(转)

    教你开发jQuery插件(转) 阅读目录 基本方法 支持链式调用 让插件接收参数 面向对象的插件开发 关于命名空间 关于变量定义及命名 压缩的好处 工具 GitHub Service Hook 原文: ...

  9. Lazy Load, 延迟加载图片的 jQuery 插件.

    Lazy Load 是一个用 JavaScript 编写的 jQuery 插件. 它可以延迟加载长页面中的图片. 在浏览器可视区域外的图片不会被载入, 直到用户将页面滚动到它们所在的位置. 这与图片预 ...

随机推荐

  1. B-Tree索引在sqlserver和mysql中的应用

    在谈论数据库性能优化的时候,通常都会提到“索引”,但很多人其实并没有真正理解索引,也没有搞清楚索引为什么就能加快检索速度,以至于在实践中并不能很好的应用索引.事实上,索引是一种廉价而且十分有效的优化手 ...

  2. Xdebug文档(五) 代码覆盖分析

    代码覆盖分析能在请求时让你知道脚本哪一行(或哪一段)在执行. 相关设置 xdebug.coverage_enable 类型: boolean, 默认值: 1, 始于 Xdebug >= 2.2 ...

  3. 那些过目不忘的H5页面

    原文链接:http://isux.tencent.com/great-mobile-h5-pages.html 从引爆朋友圈的H5小游戏<围住神经猫>,到颠覆传统广告的大众点评H5专题页& ...

  4. 更改Visual Studio 2015 默认的语言设置

    Vs支持多种语言,但有可能创建项目时,默认的开发语言不是你需要的,比如:默认是Visual C++ 你可以通过"工具"----选项----导入和导出设置来修改. 引用: https ...

  5. Sap SE16n 修改表数据

    SAP中直接修改表.视图的Tcode有SE16N和SM30. 其中使用SE16N修改表需要先输入命令&SAP_EDIT, 回车左下角显示激活SAP编辑功能后,就可以对相应的表进行新增.删除.修 ...

  6. 渗透测试-奇技淫巧(一)--源IP地址隐藏

    切记,切记.本文只作为技术交流,提醒各位注意网络安全,请勿用于其它用途,否则后果自付. 在很多时候,某某不希望不愿意有人溯源他的地址.他们是如何隐藏IP的? 今天来浅析下,如何隐藏源地址. 用到的工具 ...

  7. Sharepoint学习笔记—习题系列--70-573习题解析 -(Q136-Q138)

    Question 136You need to create a custom content type and specify the content type ID.What should you ...

  8. android重复的文件复制APK META-INF许可证错误记录

    * What went wrong:Execution failed for task ':app:transformResourcesWithMergeJavaResForDebug'.> c ...

  9. Android 四大组件之再论service

    service常见的有2种方式,本地service以及remote service. 这2种的生命周期,同activity的通信方式等,都不相同. 关于这2种service如何使用,这里不做介绍,只是 ...

  10. CYQ.Data 数据层框架 CYQ.Data 数据框架 使用篇四 MAction 增删改

    本篇内容概要 本篇继续上一篇内容,本节介绍所有增删改的相关操作. 1:添加数据 Insert方法 2:删除数据 Delete方法 3:更新数据 Update方法 一:添加操作 方法原型: public ...