T
http://jsfiddle.net/AlexeyLem/mj8usgbd/ The principle of work will be understandable, and then you'll paint it yourself...var data = [
{itemId:1, itemName:"пункт №1", itemParentId:0},
{itemId:2, itemName:"пункт №1.1", itemParentId:1},
{itemId:3, itemName:"пункт №1.2", itemParentId:1},
{itemId:4, itemName:"пункт №1.2.1", itemParentId:3},
{itemId:5, itemName:"пункт №1.2.2", itemParentId:3},
{itemId:6, itemName:"пункт №1.2.3", itemParentId:3},
{itemId:7, itemName:"пункт №2", itemParentId:0},
{itemId:8, itemName:"пункт №3", itemParentId:0},
{itemId:9, itemName:"пункт №3.1", itemParentId:8},
{itemId:10, itemName:"пункт №3.2", itemParentId:8},
{itemId:11, itemName:"пункт №3.3", itemParentId:8},
{itemId:12, itemName:"пункт №3.3.1", itemParentId:11},
{itemId:13, itemName:"пункт №3.3.1.1", itemParentId:12},
{itemId:14, itemName:"пункт №3.3.1.2", itemParentId:12},
{itemId:15, itemName:"пункт №3.3.1.3", itemParentId:12},
{itemId:16, itemName:"пункт №3.3.2", itemParentId:11},
{itemId:17, itemName:"пункт №4", itemParentId:0},
{itemId:18, itemName:"пункт №5", itemParentId:0},
{itemId:19, itemName:"пункт №5.1", itemParentId:18}
];
var checkList = {};
function getChild(list, id) {
return list.filter(function(item) {
return item.itemParentId == id;
});
}
function doTree(list) {
var html = '';
list.forEach(function(item, index) {
var chld;
if(typeof checkList[item.itemId] != 'undefined') return ;
if(chld = getChild(list, item.itemId)) {
html += ('<li><a href="javascript:void(0);">'+item.itemName+'</a><ul>'+doTree(chld)+'</ul></li>');
}else{
html += ('<li><a href="javascript:void(0);">'+item.itemName+'</a></li>');
}
checkList[item.itemId]=true;
});
return html;
}
$('#root').html(doTree(data));<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<ul id="root"></ul>The data structure is not good for wood storage...