Back to Devexpress

RibbonMenuItem Class

aspnetcore-js-devexpress-dot-richedit-67470410.md

latest4.8 KB
Original Source

RibbonMenuItem Class

A ribbon menu item.

Declaration

ts
export class RibbonMenuItem extends RibbonItemBase

Remarks

The example below demonstrates how to add a custom drop-down menu to the Home tab:

cshtml
<div id="richEditContainer"></div>
<script>
    var ribbonMenu = new DevExpress.RichEdit.RibbonMenuItem;
    ribbonMenu.id = "myMenu";
    ribbonMenu.beginGroup = true;
    ribbonMenu.icon = "favorites";
    ribbonMenu.showText = true;
    ribbonMenu.text = "Menu";
    ribbonMenu.items = [{id: 'subItem1', icon: "user", text: "item 1"}, 
                        {id: 'subItem2', icon: "chevronright", text: "item 2", items: [
                            {id: 'subItem3', icon: "image", text: "item 2.1"}, 
                            {id: 'subItem4', icon: "image", text: "item 2.2"}
                        ]}];
    var options = DevExpress.RichEdit.createOptions();
    options.ribbon.getTab(DevExpress.RichEdit.RibbonTabType.Home).insertItem(ribbonMenu,3);
    options.events.customCommandExecuted = function(s, e) {
        switch (e.commandName) {
            case 'subItem1':
                console.log(e.parameter)
        }
    };
    var container = document.getElementById("richEditContainer");
    const richEdit = DevExpress.RichEdit.create(container, options);
</script>

Inherited Members

beginGroup

id

Inheritance

RibbonItemBase RibbonMenuItem

See Also

Ribbon Customization

constructor(id, text, items)

Initializes a new instance of the RibbonMenuItem class with specified settings.

Declaration

ts
constructor(
    id: RibbonItemId,
    text: string,
    items: RibbonSubMenuItem[],
    options?: RibbonMenuItemOptions
)

Parameters

NameTypeDescription
idRibbonItemId

The item identifier.

| | text | string |

The item text.

| | items | RibbonSubMenuItem[] |

An array of sub-items.

| | options | RibbonMenuItemOptions |

The item options.

|

Properties

icon Property

Specifies the item icon’s identifier.

Declaration

ts
icon?: string

Property Value

TypeDescription
string

An icon identifier.

|

Remarks

Refer to the following help topic to view the full list of available icons and their identifiers: Built-In Icon Library.

items Property

Provides access to an array of the menu’s sub-items.

Declaration

ts
items: RibbonSubMenuItem[]

Property Value

TypeDescription
RibbonSubMenuItem[]

An array of sub-items.

|

localizationId Property

Specifies an identifier that allows you to localize the item’s text.

Declaration

ts
localizationId?: string

Property Value

TypeDescription
string

The item’s localization identifier.

|

Remarks

If the text property is specified, the item is not localized.

See Also

Angular Application - Custom Localization Strings

showText Property

Specifies the item’s text visibility.

Declaration

ts
showText: boolean

Property Value

TypeDescription
boolean

true to display the item text; otherwise, false.

|

Remarks

Use the text property to specify the item text.

text Property

Specifies the item text.

Declaration

ts
text: string

Property Value

TypeDescription
string

The item text.

|

type Property

Returns the item’s type.

Declaration

ts
readonly type = RibbonItemType.Menu

Property Value

TypeDescription
Menu

Identifies the Menu item type.

|