Listbox Context Menu

[jqwidgetsdevParticipant]

Hello.

I am trying to add a context menu to a listbox but the popup is not appearing.
Any clues?

I am reusing the code from:
http://www.jqwidgets.com/jquery-widgets-demo/demos/jqxmenu/index.htm?(arctic)#demos/jqxmenu/contextmenu.htm

// Create a jqxMenu
var contextMenu = $(“#jqxMenu”).jqxMenu({ width: ‘120px’, height: ‘140px’, autoOpenPopup: false, mode: ‘popup’, theme: theme });
// open the context menu when the user presses the mouse right button.
$(“#jqxWidget”).on(‘mousedown’, function (event) {
var rightClick = isRightClick(event);
if (rightClick) {
var scrollTop = $(window).scrollTop();
var scrollLeft = $(window).scrollLeft();

contextMenu.jqxMenu(‘open’, parseInt(event.clientX) + 5 + scrollLeft, parseInt(event.clientY) + 5 + scrollTop);
return false;
}
});

// disable the default browser’s context menu.
$(document).on(‘contextmenu’, function (e) {
return false;
});

function isRightClick(event) {
var rightclick;
if (!event) var event = window.event;
if (event.which) rightclick = (event.which == 3);
else if (event.button) rightclick = (event.button == 2);
return rightclick;
}

HTML code

<div id=”MyTabs” style=”height: 220px;”>

• jqxListBox1
• jqxListBox2

<div>
<div id=”jqxListBox1″></div>
<div id=”jqxMenu”>

• Add Item
• Remove Item

</div>
</div>
<div id=”jqxListBox2″></div>
</div>

Thanks.

[Peter StoevKeymaster]

Hi jqwidgetsdev,

The posted code would not work according to me. I would suggest you to bind to some of the jqxListBox events and open the Context Menu on item selection.

Best Regards,
Peter Stoev

jQWidgets Team
http://www.jqwidgets.com/

[jqwidgetsdevParticipant]

Thank Peter. Yes, I see what you mean now.

For the benefit of others, replacing

$(“#jqxWidget”).on(‘mousedown’, function (event) {

with

$(“#jqxListBox1”).on(‘mousedown’, function (event) {

resolves the issue.

Best regards.

[Author]

Posts