User Guide > How to Work with... > ASP.NET > Displaying Images using ASP.NET > Context Menu Customization > Adding a Context Menu Item to Any Level of Context Menu |
Context menu items can also be added to any level of a context menu. The following example shows how to add items to the second level of a context menu.
For Ajax server users, please comment out the first portion of the code below and uncomment the second. |
Example |
Copy Code |
---|---|
// get PageView control with "pluginPageView" identifier from the HTML page in jQuery plugin var pageView = $("#pluginPageView").ImGearPageViewPlugin(); // get PageView control with "pluginPageView" identifier from the HTML page for Ajax server //var pageView = $.find("pluginPageView"); // get context menu for image and HandPan mouse tool var contextMenu = pageView.getContextMenu(null, ImageGear.Web.UI.MouseTool.HandPan); // get second level menu var popupMenu = contextMenu.get(4).contextMenu; // add separator to the end of list popupMenu.insert(popupMenu.get_size(), new ImageGear.Web.UI.ContextMenuItem(ImageGear.Web.UI.ContextMenuItemType.Separator)); // create the handler of menu item for all mark types var commonClickHandler = function (pageView, mark) { if (mark) { var markType = mark.get_type(); switch (markType) { case ImageGear.Web.UI.MarkType.Line: alert('Line mark is clicked'); break; case ImageGear.Web.UI.MarkType.Polyline: alert('Polyline mark is clicked'); break; case ImageGear.Web.UI.MarkType.Rectangle: alert('Rectangle mark is clicked'); break; case ImageGear.Web.UI.MarkType.Ellipse: alert('Ellipse mark is clicked'); break; case ImageGear.Web.UI.MarkType.Polygon: alert('Polygon mark is clicked'); break; case ImageGear.Web.UI.MarkType.Text: alert('Text mark is clicked'); break; } } else { alert('No mark is clicked.'); } }; // create new context menu item var alertMenu = new ImageGear.Web.UI.ContextMenuItem (ImageGear.Web.UI.ContextMenuItemType.UserMenuItem, 'Mark Checker', undefined, commonClickHandler ); // add alert context menu item after the separator popupMenu.insert(popupMenu.get_size(), alertMenu); // set the renew context menu for HandPan mouse tool pageView.setContextMenuForTool (contextMenu, ImageGear.Web.UI.MarkType.Line, ImageGear.Web.UI.MouseTool.HandPan); pageView.setContextMenuForTool (contextMenu, ImageGear.Web.UI.MarkType.Polyline, ImageGear.Web.UI.MouseTool.HandPan); pageView.setContextMenuForTool (contextMenu, ImageGear.Web.UI.MarkType.Rectangle, ImageGear.Web.UI.MouseTool.HandPan); pageView.setContextMenuForTool (contextMenu, ImageGear.Web.UI.MarkType.Ellipse, ImageGear.Web.UI.MouseTool.HandPan); pageView.setContextMenuForTool (contextMenu, ImageGear.Web.UI.MarkType.Polygon, ImageGear.Web.UI.MouseTool.HandPan); pageView.setContextMenuForTool (contextMenu, ImageGear.Web.UI.MarkType.Text, ImageGear.Web.UI.MouseTool.HandPan); pageView.setContextMenuForTool (contextMenu, null, ImageGear.Web.UI.MouseTool.HandPan); |