这种格式类似于ztree的格式
数据: [
{"id":1,"parendId":0,"name":"Foods"},
{"id":2,"parentId":1,"name":"Fruits"},
{"id":3,"parentId":1,"name":"Vegetables"},
{"id":4,"parentId":2,"name":"apple"},
{"id":5,"parentId":2,"name":"orange"},
{"id":6,"parentId":3,"name":"tomato"},
{"id":7,"parentId":3,"name":"carrot"},
{"id":8,"parentId":3,"name":"cabbage"},
{"id":9,"parentId":3,"name":"potato"},
{"id":10,"parentId":3,"name":"lettuce"}
]
<ul id="tt"></ul>
$(function(){
$('#tt').tree({
url: 'data/tree6_data.json',
loadFilter: function(rows){
return convert(rows);
}
});
});
function convert(rows){
function exists(rows, parentId){
for(var i=0; i<rows.length; i++){
if (rows[i].id == parentId) return true;
}
return false;
}
var nodes = [];
// get the top level nodes
for(var i=0; i<rows.length; i++){
var row = rows[i];
if (!exists(rows, row.parentId)){
nodes.push({
id:row.id,
text:row.name
});
}
}
var toDo = [];
for(var i=0; i<nodes.length; i++){
toDo.push(nodes[i]);
}
while(toDo.length){
var node = toDo.shift(); // the parent node
// get the children nodes
for(var i=0; i<rows.length; i++){
var row = rows[i];
if (row.parentId == node.id){
var child ={id:row.id,text:row.name};
if (node.children){
node.children.push(child);
} else {
node.children = [child];
}
toDo.push(child);
}
}
}
return nodes;
}
分享到:
相关推荐
SSH+Easyui之TreeGrid树形展现数据源码
JS EasyUI DataGrid动态加载数据
JQUERY EASYUI 异步树
本文主要是给大家分享了一则使用EasyUI实现同步树的代码,主要是使用递归实现,非常实用的方法,推荐给小伙伴们。
easyui的datagrid的数据渲染
支持下拉菜单 下拉树 模糊搜索,支持中间字段的匹配
使用easyUI的tree插件从服务器端获取树形菜单数据,并实现树形菜单
使用easyUI生成菜单树案例,前后台代码都有
Jquery EasyUI 异步树,适合大数据量无限级加载
C#后台生成json串输出,让 easyui-combotree获取json并绑定,然后取得选中节点的值,的简单例子。
c# easyui 树菜单
easyui的树形菜单展示-同步+异步请求后台方法-含后台java代码,
jquery-easyui_combotree异步树的生成代码
EasyUI:基本布局&tree菜单数据的绑定&DataGrid数据查询&数据绑定&分页
适配bootstrap下拉,easyUI树形结构还有数据字典,需要gson包的支持
easyui-combobox控件的后台数据递归生成json,前台绑定实例说明。 可直接拷贝到项目中,然后修改数据源即可使用。
jqrery easyui tree 扩展扁平化数据生成树目录;注意:在引入jquery.js之后
easyui 树形结构样例,下拉框里面是easyui树,循环展示
对于jquery-easyui的combotree 异步树,使用上其实并不会太复杂,但是要搞明白还是比较麻烦的,本代码基本上把异步树的生成和使用都做了示例,JSP部分基本上直接拿来用即可。同时增加了实例代码和修正了上一个上传的...
下载easyui后使用其中的css和js,从一个treegrid树形网格资源 往另一个空的树形网格拖放数据,支持添加子节点、删除、编辑、保存、取消编辑、刷新、更新数据等功能