一、easyui tree基本使用
首先定义一个<ul>
<ul id="tt"></ul>
easyui tree 加载json数据:
$('tt').tree({ lines:true,//是否显示树线 url:'tree.json' });
json数据要求的格式:
[{ "id":1, "text":"My Documents", "children":[{ "id":11, "text":"Photos", "state":"closed", "children":[{ "id":111, "text":"Friend" },{ "id":112, "text":"Wife" },{ "id":113, "text":"Company" }] },{ "id":12, "text":"Program Files", "state":"closed", "children":[{ "id":121, "text":"Intel" },{ "id":122, "text":"Java" },{ "id":123, "text":"Microsoft Office" },{ "id":124, "text":"Games" }] },{ "id":16, "text":"Actions", "children":[{ "text":"Add", "iconCls":"icon-add" },{ "text":"Remove", "iconCls":"icon-remove" },{ "text":"Save", "iconCls":"icon-save" },{ "text":"Search", "iconCls":"icon-search" }] },{ "id":13, "text":"index.html" },{ "id":14, "text":"about.html" },{ "id":15, "text":"welcome.html" }] }]
其中iconCls表示的图标,这样数据就加载出来了。
二、loadFilter使用
loadFilter可以返回过滤后的数据进行展示
其使用格式:
$('tt').tree({ url:'tree.json' loadFilter:function(data){ //过滤操作 return newData; } });
例:我们从json数据查找text属性值为"Program Files"的树返回展示:
$('tt').tree({ url:'tree.json' loadFilter:function(data){ for(var i=0; i<data.length; i++){ if(data[i].text=="Program Files"){ // 定义一个数组 var newData = new Array(); newData.push(data[i]); return newData; } } return data; } });
这里我们可以看到我们使用了数组Array来存放过滤后的数据,这是因为easyui-tree加载json格式的原因,否则加载不出。
笔者是第一次写博客,不足之处请见谅,有什么异议可以互相讨论。
相关推荐
EasyUI-Tree节点操作示例,适用于大众,内含数据库打开直接用
ssm+mysql+easyui-tree的三级联动,我是将数据拼接后传到前台的,应该还是比较简单易懂的
easyui-tree-diasbleCheckbox 树的结点为disable 不能选取
jquery-easyui-tree学习 详情请看:http://blog.csdn.net/wild46cat/article/details/52763256
easyui的tree组件的使用,使用springmvc作为后台支持,前后通信是实现tree的操作
Jquery-easyui-tree常见操作,加载树,获取所有选中节点,展开和折叠所有节点,展开和展开指定的节点等操作
前台页面包括后台代码,实现了easyui-tree右键增加节点,修改节点,删除节点,包括子节点的操作,并同时更新数据库,动态更新tree
这是我自己总结出来easyui-textbox和easyui-combobox的onchange事件响应实例,绝对可用,网上很多实例都无法运行,这个我亲自测试可用使用才传上来的,供大家参考学习。
jquery-easyui-EDT-1.5.2-build1 jquery-easyui-EDT-1.5.2-build1
本资源主要是使用easyui控件,并结合ASP。net实现datagrid与数据库的连接,数据的增,删,改,分页操作,完成tree加载数据库数据,希望对开发初学者有所帮助
easyUI tree增删改操作以及easyUI window分类的
jquery-easyui-1.7.0 官方文档以及源码,演示demo,内容详细
C#后台生成json串输出,让 easyui-combotree获取json并绑定,然后取得选中节点的值,的简单例子。
本篇文章主要介绍了jquery使用EasyUI Tree异步加载JSON数据(生成树),具有一定的参考价值,感兴趣的小伙伴们可以参考一下。
JS EasyUI DataGrid动态加载数据
jquery-easyui-1.2.2jquery-easyui-1.2.2jquery-easyui-1.2.2
jquery-easyui-1.0.5API 使用说明文档 jquery_easyui_manual_cnjquery-easyui-1.0.5API 使用说明文档 jquery_easyui_manual_cnjquery-easyui-1.0.5API 使用说明文档 jquery_easyui_manual_cn
jquery-easyui-EDT-1.4.2-,包括中文文档以及一些示例,静态资源,各种样式
easyui是一种基于jQuery的用户界面插件集合。 easyui为创建现代化,互动,JavaScript应用程序,提供必要的功能。 使用easyui你不需要写很多代码,你只需要通过编写一些简单HTML标记,就可以定义用户界面。 easyui...
jQuery EasyUI jquery-easyui-1.5.5.6 版 API 中文版 PDF和chm版本,jQuery