Toolbar MenuItem properties
Usage
const data = [
{
type: "menuItem",
id?: string | number,
parent?: string,
value?: string,
items?: IMenuElement[], // ISpacer | ISeparator | IMenuItem
count?: number,
countColor?: "danger" | "secondary" | "primary" | "success",
hotkey?: string,
html?: string,
icon?: string,
multiClick?: boolean,
tooltip?: string,
css?: string | string[],
disabled?: boolean,
hidden?: boolean,
},
// more Toolbar controls
]
Description
type | (required) the type of a control, set it to "menuItem". If not specified - the "navItem" type is applied by default. |
id | (optional) the id of a control, auto-generated if not set |
parent | (optional) the parent of the item |
value | (optional) a value for the menu item. You need to set either the value or html property to the item |
items | (optional) an array of child controls (note that all the children should have the type menuItem) |
count | (optional) a badge with a number |
countColor | (optional) the color of a badge with number: "danger" | "secondary" | "primary" | "success" |
hotkey | (optional) the name of a keyboard shortcut for a menu item |
html | (optional) a string with HTML that should be inserted into the menu item |
icon | (optional) the name of an icon from the used icon font |
multiClick | (optional) if true - the "click" event will fire multiple times when the item is clicked and held; if false - the "click" event will fire on each click of the item |
tooltip | (optional) a tooltip for the menuItem |
css | (optional) adds style classes |
disabled | (optional) defines whether an item is disabled |
hidden | (optional) defines whether a control is hidden |
Example
toolbar.data.add(
{
type:"menuItem",
value:"Toolbar menuItem",
tooltip: "Press me",
items:[
{ type:"menuItem", value:"Option 1" },
{ type:"menuItem", value:"Option 2" },
{ type:"separator"},
{ type:"menuItem", value:"Option Infinite" }
]
}
);
Related article: MenuItem