ld-ztree.tpl

<div class="ld-ztree-container">
<div class="ld-ztree-header text-center" id="header">
<b>树状图</b>
</div>
<div class="ld-ztree-main ztree" ld-comp="ztree" ld-bind-data="treeData" ld-tree-type="checkbox">
<!--<ul class="ld-ztree">
<li><span class="Ztree">产品1</span>
<ul>
<li><span class="Ztree">产品1</span></li>
<li><span class="Ztree">产品1</span></li>
<li><span class="Ztree">产品1</span>
<ul>
<li><span class="Ztree">产品1</span></li>
</ul>
</li>
<li><span class="Ztree">产品1</span></li>
<li><span class="Ztree">产品1</span></li>
</ul>
</li>
<li><span class="Ztree">产品1</span>
<ul>
<li><span class="Ztree">产品1</span></li>
<li><span class="Ztree">产品1</span></li>
<li><span class="Ztree">产品1</span>
<ul>
<li><span class="Ztree">产品1</span></li>
<li><span class="Ztree">产品1</span></li>
<li><span class="Ztree">产品1</span></li>
<li><span class="Ztree">产品1</span></li>
</ul>
</li>
<li><span class="Ztree">产品1</span></li>
</ul>
</ul> !--> </div>
<div class="ld-ztree-footer text-center" id="footer">
<button class="btn btn-primary ld-margin-right30">确定</button>
<button class="btn btn-default">取消</button>
</div>
</div>

ld-ztreeview.js

define(['ldfw/core','text!tpl/example/ld-ztree.tpl'],function(LDFW,tpl){
return LDFW.Container.extend({
el:'#app',
tpl:tpl,
initialize:function(){
var zNodes=[
{id:1,pId:0,name:"产品1",open:true},
{id:11,pId:1,name:"产品1"},
{id:12,pId:1,name:"产品1"},
{id:13,pId:1,name:"产品1",open:true},
{id:131,pId:13,name:"产品1"},
{id:14,pId:1,name:"产品1"},
{id:15,pId:1,name:"产品1"},
{id:2,pId:0,name:"产品1",open:true},
{id:21,pId:2,name:"产品1"},
{id:22,pId:2,name:"产品1"},
{id:23,pId:2,name:"产品1",open:true},
{id:231,pId:23,name:"产品1"},
{id:232,pId:23,name:"产品1"},
{id:231,pId:23,name:"产品1"},
{id:231,pId:23,name:"产品1"},
{id:24,pId:2,name:"产品1",open:false},
{id:241,pId:24,name:"产品1"}
];
var _this = this;
this.model.set("treeData",zNodes);
}
});
});

效果图

如何在tpl模版的div块中加ztree的更多相关文章

  1. 子div块中设置margin-top时影响父div块位置的解决办法

    在css中设置样式时,通常会遇到用子div块margin中设置margin-top时,父div块中就会随着子div的margin-top,也会和子div执行相同的margin-top的位置样式 解决办 ...

  2. 子DIV块中设置margin-top时影响父DIV块位置的解决办法?

    解决方法: 1.修改父元素的高度,增加padding-top样式模拟(padding-top:1px:常用) 2.为父元素添加overflow:hidden:样式即可(完美) 3.为父元素或者子元素声 ...

  3. 子div块中设置margin-top时影响父div块位置的解决办法及其原因

    解决办法①: 若子DIV块中使用margin-top,则在父DIV块中添加:overflow:hidden; 解决办法②: 在子DIV块中用padding-top代替margin-top. 有个叫 b ...

  4. DIV块中 元素垂直居中

    1 DIV块中 元素垂直居中 作者:知乎用户链接:https://www.zhihu.com/question/20543196/answer/99429177来源:知乎著作权归作者所有.商业转载请联 ...

  5. 如何在Liferay Custom JSP Fragment项目中加Java代码

    先附上大神原文链接 Adding Dependencies to JSP Fragment Bundles 在开发Liferay的过程中,我们常常会利用Module Fragment来修改Lifera ...

  6. Html中div块居中显示

    表面上这个问题很难,因为涉及到浏览器窗体大小,导致部分界面效果不一致.图中的方法适用于div块大小不变的界面. 如上所示,将其分为两块,margin-left和margin-top的值均分别为widt ...

  7. Banner中利用Jquery隐藏显示下方DIV块

    实现方式1: <!DOCTYPE html><html><head>    <meta charset="UTF-8">    &l ...

  8. 如何在HTML中加载Flash(2种实现方法)_HTML/Xhtml_网页制作

    点评:如何在HTML中加载Flash,为网页添加更多的色彩,普通的网页以无法满足用户的需求,接下来为大家介绍下2种在HTML中加载Flash的方法,感兴趣的各位可以适当参考下,希望对你有所帮助 第一种 ...

  9. 采用CSS3的动态元素(动画)设计div块的层级式展现

    此练习作品是为学习HTML5+CSS3而设计的(如有不好请大家批评指教~~~). 操作:当页面加载时,点击网页中的绿色块(一层),则有其他几块(二层)从其中央出现并向外延伸并旋转,点击这几块中任意一个 ...

随机推荐

  1. Linux软raid创建

    RAID: HBA:基于主机的适配器 RAID:Redundent Array of Inexpensive Disks 廉价磁盘阵列 Independent       独立磁盘阵列 Level:仅 ...

  2. 使用lua实现一个简单的事件派发器

    设计一个简单的事件派发器,个人觉得最重要的一点就是如何保证事件派发过程中,添加或删除同类事件,不影响事件迭代顺序和结果,只要解决这一点,其它都好办. 为了使用pairs遍历函数,重写了pairs(lu ...

  3. 在VS2013中使用Log4net

    大致分为3个步骤 引用Log4net

  4. 策略模式(Strategy Pattern)

    策略模式定义了一系列的算法,并将每一个算法封装起来,而且使它们还可以相互替换.策略模式让算法独立于使用它的客户而独立变化. 环境类(Context):用一个ConcreteStrategy对象来配置. ...

  5. 如何让老式浏览器支持html5新增的语义元素

    html5新增加了一些语义元素,如header, footer, nav, aritcle, aside,等等. 然而,有些老款浏览器无法识别这些元素,会把它们当成 inline 元素对待,这会导致一 ...

  6. Linux-磁盘及网络IO工作方式解析

    PIO与DMA 有必要简单地说说慢速I/O设备和内存之间的数据传输方式. PIO我们拿磁盘来说,很早以前,磁盘和内存之间的数据传输是需要CPU控制的,也就是说如果我们读取磁盘文件到内存中,数据要经过C ...

  7. Java-接口和抽象类区别

    在类的设计中,需要明确一个原则,一个类不要去继承一个已经实现好的类,只能继承抽象类或实现接口,如果接口和抽象类都可以使用,那么优先使用接口,避免继承局限

  8. openssl 升级

    openssl version -a rpm -q --changelog  openssl | grep CVE bash -version #!/bin/bash if [[ $EUID -ne ...

  9. 一段关于测试和自定义Attribute的代码

    来自<西夏普入门经典> using System; using System.Collections.Generic; using System.Linq; using System.Te ...

  10. asp.net中使用基于角色role的Forms验证

    http://www.cnblogs.com/yao/archive/2006/06/24/434783.html asp.net中使用基于角色role的Forms验证,大致经过几下四步:1.配置系统 ...