Question

I am using the following jQuery Context Menu:

http://www.javascripttoolbox.com/lib/contextmenu/index.php

The usage is quite simple, in that you create a menu like this

var menu1 = [
  {'Option 1':function(menuItem,menu) { alert("You clicked Option 1!"); } },
  $.contextMenu.separator,
  {'Option 2':function(menuItem,menu) { alert("You clicked Option 2!"); } }
];
$(function() {
  $('.cmenu1').contextMenu(menu1,{theme:'vista'});
});

then you simply name the div class with the menu function name, so in this example

The problem I'm facing is that I have around 30 div layers inside table cells, I've classed them all as cmenu1 because I don't want to replicate 30 different menu functions. Essentially I need them to all have the same menu options, but the on click action for each div needs to be different. So for example, if I click option 1 on div1, it should be able to alert me on the div number.

Was it helpful?

Solution

var menu1 = [
  {'Option 1':function(menuItem,menu) { var myDIV = $(this).closest("div.cmenu1").attr("id"); alert("You clicked Option 1 inside div id " + myDIV  + " !"); } },
  $.contextMenu.separator,
  {'Option 2':function(menuItem,menu) { var myDIV = $(this).closest("div.cmenu1").attr("id"); alert("You clicked Option 2 inside div id " + myDIV  + " !"); } }
];
$(function() {
  $('.cmenu1').contextMenu(menu1,{theme:'vista'});
});
Licensed under: CC-BY-SA with attribution
Not affiliated with StackOverflow
scroll top