Skip to main content

Work with Menu

Hiding/showing menu options​

You can hide and show menu items (one or several at once) with the help of the hide() / show() methods:

menu.hide(id);
menu.show(id);

Related sample: Menu. Show / hide menu item

Both methods can take one parameter - the ID of a menu item or an array with IDs of menu items.

Starting from v7.0, it is possible to hide/show all Menu items on the page at once by using the methods without parameters:

// hides all Menu items
menu.hide();
// shows all Menu items
menu.show();

Disabling/enabling menu options​

You can disable one menu option or several options at a time with the disable() method:

menu.disable("1");
menu.disable(["2","3"]);

To enable one menu option or several options at a time, use the enable() method:

menu.enable("1");
menu.enable(["1","3"]);

Related sample: Menu. Enable / disable menu item

Both methods can take one parameter: the ID of a menu item or an array of IDs.

Starting from v7.0, it is possible to disable/enable all Menu items on the page at once by using the methods without parameters:

// disables all Menu items
menu.disable();
// enables all Menu items
menu.enable();

Checking if a menu option is disabled​

To check if an item of Menu is disabled, call the isDisabled() method. The method takes one parameter:

id(string, number) an id of a menu item
menu.isDisabled("1"); // -> true/false

Related sample: Menu. Enable / disable menu item

Selecting/Unselecting an item​

Selecting a menu item​

To select a particular Menu item, make use of the select() method of Menu. The method takes two parameters:

id(string, number) an id of an item
unselect(boolean) optional, true - to unselect previously selected items, otherwise - false; true by default

menu.select("align-left");

Related sample: Menu. Select / unselect

Unselecting a menu item​

To remove selection from a selected item, apply the unselect() method of Menu. The method may take the id of an item as a parameter:

// unselects a specified selected item
menu.unselect("align-left");

It is also possible to remove selection from all previously selected items of Menu via the unselect() method:

// unselects all previously selected items
menu.unselect();

Related sample: Menu. Select / unselect

Checking if a menu item is selected​

To check if an item of Menu is selected, call the isSelected() method. The method takes one parameter:

id(string, number) an id of a menu item

menu.isSelected("align-left"); // -> returns true/false

Related sample: Menu. Select / unselect

Getting selected items​

To get the selected items, call the getSelected() method. The method returns an array of string values with IDs of selected items:

menu.getSelected(); // -> ["selected_1", "selected_1.1"]

Using Tree collection API​

You can manipulate the controls of Menu with the help of the Tree collection API.

Adding menu items​

You can add menu items with the add() method of tree collection:

menu.data.add({
    type:"separator"
});

menu.data.add({
    value:"Open", items:[
        { value:"File", hotkey:"Ctrl+F" },
        { value:"Folder" }
    ]
});

Related sample: Menu. Add / remove Item

Rearranging menu items​

You can move menu items to different positions with the move() method. For example, this is how you can move an item with ID "2" to the left edge of the menu:

menu.data.move("2",0);
note

The ID should always be a string, even if in menu item configuration you set it as a number.

To get the current position, use the getIndex() method of TreeCollection:

menu.data.getIndex("id");
note

Indexes are counted from 0.

Iterating menu items​

You can work with all (or some) menu items with the help of the forEach() method of TreeCollection:

// remove all icons from the menu
menu.data.forEach(function(item){
    item.icon = "";
});
menu.paint();

Setting item text​

You can set text labels for any menu item. Access the needed item with the getItem() method of the TreeCollection:

menu.data.getItem("id").value = "Open";
menu.paint();

Setting item hotkey​

You can add a shortcut to a menu option by accessing it with the help of the getItem() method. After you add a hotkey, a label with the keys will be added to the option.

menu.data.getItem("id").hotkey = "Ctrl+N";
menu.paint();

Removing menu items​

You can remove any item from a menu with the remove() method. The item will be removed with all its sub-items.

menu.data.remove("id");

Related sample: Menu. Add / remove Item

To remove all items from Menu, call the removeAll() method. Afterwards, you can load other options.

menu.data.removeAll();
menu.data.parse(new_options);
note

Check the full list of Tree collection API.