popMenu

The popMenu object provides a function for creating pop-up menus. It also provides a function to add/remove items to an existing pop-up menus.

Methods

• create
• add
• remove

create

pb.popMenu.create(menuData, triggerSelector, [filterTriggerSelector])

Create a new pop menu. A pop menu consists of one or more submenus defined by the menuStructure. A pop menu always displays one submenu at a time. Typically, it will start by showing the 'root' submenu.

Returns: Object - Returns a popMenu object which can be used directly to control various aspects of the menu that was created.

Param	Type	Default	Description
menuData	Object
menuData.menuStructure	Object.<string, Submenu>		The menu structure defines the all submenus associated with the popmenu. Typically, there should be a 'root' submenu defined here.
[menuData.startingMenu]	string	"root"	Indicate which submenu should be shown when the pop menu opens.
[menuData.opensOn]	string	"click"	The event name that triggers the menu to open.
[menuData.placement]	'top left' | 'top right' | 'bottom right' | 'bottom left'	"bottom left"	How to position the menu against the element that triggered the menu to open.
[menuData.positionOffsetX]	number		Offsets menu placement on x-axis.
[menuData.positionOffsetY]	number		Offsets menu placement on y-axis.
[menuData.positionAgainstSelector]	string		Use this to position the menu in relation to a different element. By default, the menu is positioned in relation to the element that triggers the menu.
[menuData.addMenuClass]	string		Add one or more classes to the menu element. Separate multiple classes with spaces.
[menuData.overlayClass]	string		Add one or more classes to the overlay element. Separate multiple classes with spaces.
[menuData.onBeforeShow]	function		Function to run before the menu opens.
triggerSelector	string		Target the elements that trigger the pop menu to open.
[filterTriggerSelector]	string		Further filters the elements selected by the triggerSelector. Only these filtered elements trigger the pop menu to open.

add

pb.popMenu.add(popMenuId, params)

Add your own custom menu items to exising popMenus.

Param	Type	Description
popMenuId	string	The data-id attribute for the popMenu you want to add to.
params	Object
params.id	string	A unique id to identify the menu structure you are adding.
params.menuStructure	Object.<string, Submenu>	The menu structure to add. It should have a root level menu defined at the minimum.

remove

pb.popMenu.remove(popMenuId, params)

Remove custom menu items from exising popMenus.

Param	Type	Description
popMenuId	string	The data-id attribute value for the popMenu you want to remove from.
params	Object
params.id	string	The unique id of the menu structure you are removing.

Submenu

A Submenu consists of a title and the menu items associated with it.

Properties

Name	Type	Description
[title]	string	The title of the submenu.
items	Array.<MenuItem>	The menu items that appear for this submenu.

MenuItem

Represents individual items that are displayed for a Submenu.

Properties

Name	Type	Description
text	string	The label to show for the menu item.
[css]	Object	An object with css styles to apply to the text.
[icon]	string	A classname to apply an icon (e.g. pbi-cog).
[iconCss]	Object	An object with css styles to apply to the icon.
[href]	string	A URL to redirect to if the menu item is clicked.
[action]	function	A function to run when the menu item is clicked.
[submenu]	string	Allows the menu item to open another Submenu. The string corresponds to the key for the Submenu specified in the menuStructure.
[disabled]	boolean	If true, the menu item is disabled.
[keepOpen]	boolean	If true, the popMenu stays open if this menuItem is clicked.
[addSeparator]	boolean	If true, a line will appear below this menuItem.