ASPxClientHtmlEditor.ContextMenuShowing Event

Occurs on the client side before a context menu is shown.

Declaration

ContextMenuShowing: ASPxClientEvent<ASPxClientEventHandler<ASPxClientHtmlEditor>>

Event Data

The ContextMenuShowing event's data class is ASPxClientEventArgs.

Remarks

Write a ContextMenuShowing event handler to perform specific actions on the client side before every time the context menu is shown. You can use this event to show/hide menu items based on the currently selected element.

Example

The code sample below demonstrates how you can handle the ASPxClientHtmlEditor.ContextMenuShowing event to change the content of a context menu (by changing its items visibility).

C#
JS
ASPX

csharp

protected void Page_Load(object sender, EventArgs e) {
     if (!IsPostBack) {
          MyHtmlEditor.ContextMenuItems.CreateDefaultItems();
          MyHtmlEditor.ContextMenuItems.Insert(0, new HtmlEditorContextMenuItem("Add Title...", "AddTitle"));
          MyHtmlEditor.ContextMenuItems.Insert(1, new HtmlEditorContextMenuItem("Change Title...", "ChangeTitle"));
          MyHtmlEditor.ContextMenuItems.Insert(2, new HtmlEditorContextMenuItem("Remove Title", "RemoveTitle"));
     }
}

javascript

function OnContextMenuShowing(s, e) {
     var contextMenu = s.GetContextMenu();
     var selectedElement = myHtmlEditor.GetSelection().GetSelectedElement();
     var isImageSelected = selectedElement && selectedElement.tagName.toLowerCase() == "img";

     SetContextMenuItemVisible(contextMenu, "AddTitle", isImageSelected && !selectedElement.title);
     SetContextMenuItemVisible(contextMenu, "ChangeTitle", isImageSelected && selectedElement.title);
     SetContextMenuItemVisible(contextMenu, "RemoveTitle", isImageSelected && selectedElement.title);
}

function SetContextMenuItemVisible(contextMenu, itemName, visible) {
     var item = contextMenu.GetItemByName(itemName);
     if(item)
          item.SetVisible(visible);
}

aspx

<dx:ASPxHtmlEditor ID="DemoHtmlEditor" runat="server" ClientInstanceName="myHtmlEditor">
     <ClientSideEvents ContextMenuShowing="OnContextMenuShowing"

     ...

</dx:ASPxHtmlEditor>