I try to populate sidemenu body with variables but doesn’t work.
If I use this code doesn’t work
webix.ui({
view: "sidemenu",
id: "menutablet",
//width: 200,
position: "left",
state: function (state) {
var toolbarHeight = $$("toolbarS4BT").$height;
state.top = toolbarHeight;
state.height -= toolbarHeight;
},
css: "my_menu",
body: menu
});
var menu = {
view: "menu", id: "top:menu",
width: 180, layout: "y", select: true,
template: "<span class='webix_icon fa-#icon#'></span> #value# ",
data: [
{ value: "Dashboard", id: "start", icon: "briefcase" },
{ value: "tablet", id: "mydash", icon: "arrows" },
{ value: "GridLayout", id: "mygrid", icon: "user" },
{ value: "processi", id: "data", icon: "envelope-o" },
{ value: "test", id: "widgets", icon: "briefcase" }
],
click: (id) => {
this.show(id);
//webix.message(id);
}
};
otherwise if I use this code all work fine
webix.ui({
view: "sidemenu",
id: "menutablet",
//width: 200,
position: "left",
state: function (state) {
var toolbarHeight = $$("toolbarS4BT").$height;
state.top = toolbarHeight;
state.height -= toolbarHeight;
},
css: "my_menu",
body: {
cols:[
{
view: "menu", id: "top:menu",
width: 180, layout: "y", select: true,
template: "<span class='webix_icon fa-#icon#'></span> #value# ",
data: [
{ value: "Dashboard", id: "start", icon: "briefcase" },
{ value: "tablet", id: "mydash", icon: "arrows" },
{ value: "GridLayout", id: "mygrid", icon: "user" },
{ value: "processi", id: "data", icon: "envelope-o" },
{ value: "test", id: "widgets", icon: "briefcase" }
]
}
]
}
});
But i don’t understand why.