У меня простой HTML-макет, который выглядит так:
<div id="foo">
<ul>
<li id="id1"><a href="#">some category 1</a>
<ul><li><a href="#">some text</a></li></ul>
<ul><li><a href="#">some text</a></li></ul>
</li>
<li id="id2"><a href="#">some category 2</a>
<ul><li><a href="#">some text</a></li></ul>
<ul><li><a href="#">some text</a></li></ul>
</li>
</ul>
</div>
Определение jstree выглядит следующим образом:
$('#foo').jstree({
"core" : {
"animation" : 0
},
"themes" : {
"theme" : "classic",
"dots" : false,
"icons" : true
},
"sort" : function (a, b) {
return this.get_text(a) > this.get_text(b) ? 1 : -1;
},
"types" : {
"valid_children" : [ "folder" ],
"types" : {
"folder" : {
"valid_children" : [ "file" ],
"icon" : { "image" : "/path/to/images/folder.png"},
"max_depth" : 1
},
"file" : {
"valid_children" : [ "none" ],
"icon" : { "image" : "/path/to/images/file.png" },
}
}
},
"plugins" : [ "html_data", "themes", "contextmenu", "search", "sort", "types" ]
});
Однако, я все еще получаю общие значки тем для файлов. Категория должна иметь папку, а подкатегории должны иметь файл. Я что-то пропустил?
Вот ответ. Для каждого типа "папка", "файл" и т.д. Вы помещаете элемент списка rel= где-то "папка" и еще что-то. Затем в вашей конфигурации jstree у вас есть эти настройки для плагинов типов:
'types' : {
'valid_children' : [ 'folder' ],
'types' : {
'folder' : {
'valid_children' : [ 'file'],
'max_depth' : 1
},
'file' : {
'valid_children' : [ 'none' ],
'icon' : { 'image' : safari.extension.baseURI + 'images/file.png' },
}
}
},
Мы определяем, что делать с каждым типом "rel" здесь. Таким образом, jstree возьмет тип rel в элементе списка и выяснит, что с ним делать из этих определений.