学习layui.dtree请前往 http://www.wisdomelon.com/DTreeHelper/

记录一下dtree的自定义扩展toolbar按钮(toolbarExt)

html代码:

            <div style="width:40%;display: inline-block">
<table id="LAY-user-back-serconfig" lay-filter="LAY-user-back-serconfig" class="layui-hidden"></table>
</div>

js代码:


dtree.render({
elem: "#LAY-user-back-serconfig",
data: dataArr, // 使用data加载
width:'280px',
height: "543px",
toolbar: true,
ficon:"3" / ["0", "6"] / "-1" / ["-1", "2"],
icon:"3" / ["0", "6"] / "-1" / ["-1", "2"],
toolbarWay: "follow", // "contextmenu":右键菜单(默认),"fixed":"固定在节点后","follow":"跟随节点动态呈现"
toolbarShow: []
,toolbarFun:{
loadToolbarBefore: function(buttons, param, $div){
// console.log(buttons);
// console.log(param);
// console.log($div);
if(param.level == 1){
buttons.testEdit = "";
buttons.testDel = "";
}
else if(param.level == 3){ // 如果是叶子节点
buttons.testAdd = ""; // 取消新增功能
}
return buttons; // 将按钮对象返回
}
}
,toolbarExt: [
{
toolbarId: "testAdd", icon: "dtree-icon-add-circle", title: "新增", handler: function (node, $div) {
console.log(node.nodeId);
var content, title, url;
if (node.level == 1) {
url = '/monitor/system-info'
content = './serConfigform.html';
title = '新增服务资源信息'
}
if (node.level == 2) {
url = '/monitor/service-resources-info'
content = './serCofigformtwo.html';
title = '新增服务资源系统信息'
}
else if (node.level == 3) {
return false
}
add(node, content, title, url);//调用添加函数
}
},
{
toolbarId: "testEdit", icon: "dtree-icon-bianji", title: "编辑", handler: function (node, $div) {

var content, title, url;
var id = node.nodeId;
if (node.level == 1) {
return false
}
else if (node.level == 2) {
url = '/monitor/system-info/';
content = './serConfigform.html#/id=' + id;
title = '修改服务资源系统信息';

} else if (node.level == 3) {
url = '/monitor/service-resources-info/';
content = './serCofigformtwo.html#/id=' + id
title = '修改服务资源信息'
}
update(node, content, title, url);//调用更新函数
}
},
{
toolbarId: "testDel",
icon: "dtree-icon-roundclose",
title: "删除",
handler: function (node, $div) {
var url;
if (node.level == 1) {
return false
}
else if (node.level == 2) {
url = "/monitor/system-info/";
} else if (node.level == 3) {
url = "/monitor/service-resources-info/"
}
del(node, url);//调用删除函数
// DTree5.partialRefreshDel($div); // 这样即可删除节点
}
}]

});

渲染之后的效果图,规定一级节点只能添加,二级节点可以增、删、改,三级节点可以删除、修改,不能添加。
通过toolbarFun来控制返回的toolbar按钮


layui.dtree的学习,自定义扩展toolbar按钮(toolbarExt)的更多相关文章

  1. Layui数据表格加入自定义扩展方法(重新渲染Render当前页数据)

    具体开发中遇到的问题如下, 数据表格的重新渲染或重新加载会导致当前操作的分页 或 配置被清空.我正在操作第5页,重新渲染后就回到了最原始第1页. 需要达到的效果是: 不调用接口,仅仅只是从table. ...

  2. Silverlight实例教程 - 自定义扩展Validation类,验证框架的总结和建议(转载)

    Silverlight 4 Validation验证实例系列 Silverlight实例教程 - Validation数据验证开篇 Silverlight实例教程 - Validation数据验证基础 ...

  3. asp.net学习之扩展GridView

    原文:asp.net学习之扩展GridView 本节讨论如何从现有的控件,进而扩展成强大的,更定制的GridView控件 1.扩展BoundField 默认的BoundField不能显示多文本,文字一 ...

  4. 代码走查25条疑问 C# 跳转新的标签页 C#线程处理 .Net 特性 attribute 学习 ----自定义特性 看懂 ,学会 .NET 事件的正确姿势-简单版

    代码走查25条疑问   代码走查(Code Review) 是一个开发人员与架构师集中讨论代码的过程.通过代码走查可以提高代码的 质量,同时减少Bug出现的几率.但是在小公司中并没有代码走查的过程在这 ...

  5. 第一步 使用sencha touch cmd 4.0 创建项目、打包(加入全局变量、公用类、自定义扩展、资源文件)

    参考资料: http://www.cnblogs.com/qqloving/archive/2013/04/25/3043606.html http://www.admin10000.com/docu ...

  6. WCF自定义扩展,以实现aop!

    引用地址:https://msdn.microsoft.com/zh-cn/magazine/cc163302.aspx  使用自定义行为扩展 WCF Aaron Skonnard 代码下载位置: S ...

  7. Jquery自定义扩展方法(二)--HTML日历控件

    一.概述 研究了上节的Jquery自定义扩展方法,自己一直想做用jquery写一个小的插件,工作中也用到了用JQuery的日历插件,自己琢磨着去造个轮子--HTML5手机网页日历控件,废话不多说,先看 ...

  8. iOS自定义的UISwitch按钮

    UISwitch开关控件 开关代替了点选框.开关是到目前为止用起来最简单的控件,不过仍然可以作一定程度的定制化. 一.创建 UISwitch* mySwitch = [[ UISwitchalloc] ...

  9. bootstrap基础学习【菜单、按钮、导航】(四)

    <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...

  10. iOS学习系列 - 扩展机制category与associative

    iOS学习系列 - 扩展机制category与associative category与associative作为objective-c的扩展机制的两个特性,category即类型,可以通过它来扩展方 ...

随机推荐

  1. kali WiFi相关研究(学习中...)

    基础环境准备: 笔记本一台E470c(内置网卡 Qualcomm Atheros QCA9377 802.11ac) # 经过测试创建虚拟AP不成功 外置网卡一个:UGREEN 绿联AC1300M,芯 ...

  2. printf函数size_t的替换字符串zu

    参考:https://stackoverflow.com/questions/2524611/how-can-one-print-a-size-t-variable-portably-using-th ...

  3. 从FGUI中取一张图片并返回一个Sprite

    从Fgui中的图集中取一个图素,把图素用到场景等非UI的地方. 此操作会动态创建一个Sprite对象,效率不好,不适合大量使用. private static Dictionary<string ...

  4. AVL tree rotate

    AVL tree single rotate /** * Rotate binary tree node with left child. * For AVL trees, this is a sin ...

  5. mysql数据增量及备份操作

    注:当数据库出现异常的时候,我们可以先恢复最近一次的全量备份,接着将增量备份的文件一个一个按顺序恢复即可实现原来数据库的恢复. 还可以使用innobackupex 备份工具. 备份 # 1,开启 bi ...

  6. Flink Concept Timely Stream Processing -Flink概念及时流处理

    目录 介绍 时间概念:事件时间和处理时间 事件时间和水印 并行流中的水印 延迟 窗口 翻译来源- Concept Timely Stream Processing 介绍 及时的流处理是有状态流处理的扩 ...

  7. webpack-dev-middleware改造成koa中件间

    const webpackDev = require('webpack-dev-middleware'); function applyMiddleware(middleware, req, res) ...

  8. SQL Server性能优化

    源代码文件 1,什么是性能问题? 现有资源没有达到最大吞吐量的前提下,系统不能满足合理的预期表现,则可以定义为有性能问题.性能指标包括:响应时间,吞吐量,可扩展性. 2,初探优化 2.1优化论 一般遇 ...

  9. (一)REDIS之常见数据结构及操作

    (一)基本数据结构 1.1 String结构: String底层结构是动态字符串,可修改指定位置数据,通过预分配冗余空间减少内存的频繁分配,实际分配的空间capacity一般要高于实际字符串长度len ...

  10. C#textbox更改字体颜色只读后不起作用的解决办法

    textbox的属性ReadOnly设置为true只读后,只更改字体颜色并不起作用. 解决办法是,连同背景色一起设置即可. textBox1.BackColor =textBox1.BackColor ...