Implementing the Tree within our existing Admin system. Now that the Admin system is well developed and Webix well integrated within it, opportunities to solve problems by some completely different approach are now closed.
We have a problem with a Row in the Tree.
This is how we generate the Tree (generated by our PHP Function"publishDataTree")
$wjs .= "
[{type: 'header', template: adminTitle('".$this->table."', '".$this->type."', 'dtree')},
{
view:'tree', id: 'dtree', css: 'clqtree',
url: '".$this->sitepath."includes/get.php?langcd=".$this->lcd."&action=gettreeset&table=".$this->table."&tabletype=".$this->type."',
// template: function(obj) {return '<span class=\"clqrow\">' + obj.value + '</span>';},
on:{
onBeforeLoad:function(){
webix.message('Loading...');
},
onAfterLoad:function(){
if (!this.count()) {
webix.message('Sorry, there is no data');
}
},
// onItemClick: function(id) { alert('Id: ' +id); },
// onContext: function() {}
onAfterRender: function() { // Anything that is needed after the Datatree is loaded
// Button Toolbar for Context Menu
$('div.webix_tree_item span').toolbar({
content: '#admintoolbar', position: 'top', hideOnClick: true
}).on('toolbarItemClick', function(event, clicked) {
toolBarMenu(this, clicked);
});
}
}
}]
";
return $wjs;
This is a snippet of the generated source code for our Menu management Tree:
< div view_id=“dtree” class=“webix_view webix_tree clqtree”
< div class=“webix_scroll_cont”
<div class=“webix_tree_leaves”
< div class=“webix_tree_branch_1”
< div webix_tm_id="2" class="webix_tree_item"
<div class="webix_tree_none" < /div
<div class="webix_tree_file" < /div
< span a : Home Page < /span
< /div
< /div
< div class="webix_tree_branch_1"
< div webix_tm_id="4" class="webix_tree_item"
< div class="webix_tree_open" < /div
< div class="webix_tree_folder_open" < /div
< span b : Products < /span
< /div
......................
< /div
< /div< /div< /div
We need to address the within the webix_tree_item. The easiest way to do this would be to do, as we do in Datatable and List, to add a Class of our own, say clqrow.
When we added a Template (see Template commented out) it worked but all the Tree navigation disappeared. In other words, the Template replaced the Div with Class: webix_tree_item. So that is no good.
We have tried various jQuery selector tricks in onAfterRender but that which works in Datatable and List is not working with Tree.
We shall persevere but at the moment we are stopped - if Template does not perform correctly, Span does not contain any Class by default, that we can address and we cannot address the Span, even after Render.
Suggestions please.