Easy Tutorial
❮ Jeasyui Tree Tree2 Jeasyui App Crud1 ❯

jQuery EasyUI Menu and Button Plugin - Menubutton Menu Button



Extends from $.fn.linkbutton.defaults. Overrides the default defaults with $.fn.menubutton.defaults.

The menu button (menubutton) is a part of the dropdown menu. It is related to the link button (linkbutton) and the menu (menu). It displays the link button (linkbutton) and hides the menu (menu). When the user clicks or moves the mouse over the link button (linkbutton), the menu (menu) is displayed to allow the user to click on the menu.

Dependencies

Usage

Typically, the menu button (menubutton) is created declaratively from markup.

<a href="javascript:void(0)" id="mb" class="easyui-menubutton"
    data-options="menu:'#mm',iconCls:'icon-edit'">Edit</a>
<div id="mm" style="width:150px;">
    <div data-options="iconCls:'icon-undo'">Undo</div>
    <div data-options="iconCls:'icon-redo'">Redo</div>
    <div class="menu-sep"></div>
    <div>Cut</div>
    <div>Copy</div>
    <div>Paste</div>
    <div class="menu-sep"></div>
    <div data-options="iconCls:'icon-remove'">Delete</div>
    <div>Select All</div>
</div>

Create a menu button (menubutton) using JavaScript.

<a href="javascript:void(0)" id="mb">Edit</a>
<div id="mm" style="width:150px">
...
</div>
$('#mb').menubutton({
    iconCls: 'icon-edit',
    menu: '#mm'
});

Properties

The properties extend from the link button (linkbutton). The following are the properties added by the menu button (menubutton).

Name Type Description Default Value
plain boolean If set to true, displays a simple effect. true
menu string The selector used to create the corresponding menu (menu). null
duration number The duration in milliseconds to display the menu (menu) when hovering over the button. 100

Methods

The methods inherit from the link button (linkbutton). The following are the methods added or overridden by the menu button (menubutton).

Name Parameters Description
options none Returns the options object.
disable none Disables the menu button (menubutton).
enable none Enables the menu button (menubutton).
destroy none Destroys the menu button (menubutton).

❮ Jeasyui Tree Tree2 Jeasyui App Crud1 ❯