How can I open menu from custom call?

Suite and Optimus Suite 5
#1

I have a dhtmlXMenu but I do not want it to work as a File-menu as by default.

I want to open the menu on a custom event. In this case, I have a element. When someone clicks on the element my menu should be visible.

It is also important that the main sibling is not visible.

Can you accomplish this with dhtmlXMenu?

Thank you in advance!

#2

You may use showContextMenu to open menu in a certain position:

menu.showContextMenu(x,y)

#3

I cannot get it to work:

<head>
<script>
  menu = new dhtmlXMenuObject("CMS__help_optmenu", "dhx_skyblue");

  menu.addNewSibling(null, "root", "Options", false);
  menu.addNewChild("root", 0, "navi", "Navigate", false);
       menu.addNewChild("navi", 0, "back", "Back", false);
       menu.addNewChild("navi", 1, "forward", "Forward", false);
       menu.addNewChild("navi", 2, "stop", "Stop", false);
       menu.addNewChild("navi", 3, "refresh", "Refresh", false);
       menu.addNewChild("navi", 4, "home", "Home", false);

  menu.addCheckbox('child', 'root', 1, 'show_tree', 'Show menu tree', true, false);
  menu.addCheckbox('child', 'root', 2, 's_highlight', 'Highlight search results', true, false);

  menu.addNewChild("root", 3, "print", "Print", false);

  menu.setHotKey('back', 'ALT+B');
  menu.setHotKey('forward', 'ALT+F');
  menu.setHotKey('stop', 'ALT+S');
  menu.setHotKey('refresh', 'ALT+R');
  menu.setHotKey('home', 'ALT+H');
  menu.setHotKey('print', 'ALT+P');

  menu.addNewSeparator("navi", 'sep_1');
  menu.addNewSeparator("s_highlight", 'sep_2');

  menu.setHref('back', 'javascript:history.go(-1);', '_self');
  menu.setHref('forward', 'javascript:history.go(1);', '_self');
  menu.setHref('stop', 'javascript:window.stop();', '_self');
  menu.setHref('refresh', 'javascript:window.location.reload();', '_self');
  menu.setHref('home', './help.php?contentID=home', '_self');
</script>
</head>


<body>
  <div id="button_option" onclick="menu.showContextMenu(30,50);">Open my menu</div>
</body>

It never opens any menu when i perform a onclick event on my div.

I also tried adding the following, but that gave me the js error “polygon is undefined”:

  menu.renderAsContextMenu();
  menu.addContextZone('button_option);

Any suggestions? Thank you in advance!

#4

Hello,

Please see attached demo.
73.zip (39.3 KB)

#5

Wow that was just what I was looking for!

PS! Your support is GREAT! And this is even when I am a non-paying customer!
I can’t hardly wait until I am a paying customer of yours!

You are simply the best! Thank you so much for the great support from all of your team!

Kind regards from Sweden.

#6

Hello & thanks for kind words.
Enjoy DHTMLX.

#7

We are currently using this approach which works great except the menu loads fine but never closes if you don’t enter and leave the area. Is there anyway to add a setTimeout that will automatically close the menu after a period of time? We are using dhtmlxMenu version 3.0 if that helps.

#8

lk800
In the attached demo menu hides if you passing out of the its area.
Please, try it.

#9

It only works if you enter the area first. It would be more user friendly if we could add setTimeout. I found an old post http://forum.dhtmlx.com/viewtopic.php?f=4&t=1940&p=5422&hilit=menu+close+after#p5422 but it references out dated code.

#10

Use the next:

menu.attachEvent("onClick", function(id, zoneId, casState){ window.setTimeout(function() { menu.hide(); }, 9000); });
or:

menu.attachEvent("onTouch", function(id){ window.setTimeout(function() { menu.hide(); }, 9000); });
Or any other event handler you need

#11

The same point with context menu