// THIS DOES NOT WORK
$('.inputfield').each(function() {
$(this).contextmenu({
target:'#context-menu',
onItem: function(e, item) {
alert($(item).text());
});
});
// THIS DOES WORK
$('.inputfield').each(function() {
$(this).contextmenu({
target:'#context-menu',
onItem: function(e, item) {
alert($(item).text());
});
});
I activated a contextmenu using data attributes on multiple input fields as below:
<div class="inputfield" id="input-field1" data-toggle="context" data-target="#context-menu"> <div class="inputfield" id="input-field2" data-toggle="context" data-target="#context-menu"> <div class="inputfield" id="input-field3" data-toggle="context" data-target="#context-menu"> ....
There is no easy way to invoke onItem for the contentmenu unless I do:
$('#context-menu ul li').each(function(i, li) { $(li).click(function() { alert($(this).text()); }); });
or I do the following multiple times for each field:
$('#input-field1').contextmenu({ target:'#context-menu', onItem: function(e, item) { alert($(item).text()); } }); ...
// THIS DOES NOT WORK $('.inputfield').each(function() { $(this).contextmenu({ target:'#context-menu', onItem: function(e, item) { alert($(item).text()); }); });
I am expecting something more robust like:
$('#content-menu').setup({ onItem: function(e, item) { alert($(item).text()); } });
Does this make sense?