search

primefaces / primeng

The Most Complete Angular UI Component Library
https://primeng.org
Other
10.61k stars 4.62k forks source link

ContextMenu does not disappear after click off #2456

Closed christiefrieg closed 7 years ago

christiefrieg commented 7 years ago

I'm submitting a ... (check one with "x")

[ X] bug report => Search github for a similar issue or PR before submitting
[ ] feature request => Please check if request is not on the roadmap already https://github.com/primefaces/primeng/wiki/Roadmap
[ ] support request => Please do not submit support request here, instead see http://forum.primefaces.org/viewforum.php?f=35

Plunkr Case (Bug Reports) Please fork the plunkr below and create a case demonstrating your bug report. Issues without a plunkr have much less possibility to be reviewed.

http://plnkr.co/edit/77OG7zX3LToGoidKaKOS

Current behavior The document click event does not successfully hide the ContextMenu if the user left-clicks outside the context menu.

Expected behavior When clicking anywhere but the context menu, the ContextMenu should disappear.

Minimal reproduction of the problem with instructions Steps to reproduce:

  1. Add a datatable to an HTML page.
  2. Enable and configure a contextMenu according to https://www.primefaces.org/primeng/#/datatable/contextmenu
  3. Right click on a row in the data table. Note the contextmenu appears properly.
  4. Left click on another data row or outside the data table. The contextmenu does not disappear as you would expect. If you move the mouse over the context menu, it will disappear then.

What is the motivation / use case for changing the behavior? The user will expect that when you click off the context menu, the menu should disappear.

Please tell us about your environment: Visual Studio 2017, npm, angular 2

sudheerj commented 7 years ago

I can't replicate the issue on showcase example with the latest version. Please comment on this if you still able to replicate the issue.

hanvyj commented 7 years ago

I have the issue where the context menu doesn't close if you right click elsewhere, so you can open multiple context menus for example.

tigrenok00 commented 6 years ago

I have this issue happening with Turbo Table, see https://github.com/primefaces/primeng/issues/5105

Mighteemouse3 commented 6 years ago

I am running primeNG version 6.1.4 and in my table I am getting this same behavior. Clicking a menu item opens the dialog that I am expecting and when I close my dialog, it is still showing the context menu. Left clicking on any other row in the Table doesn't make it go away either. I thought it was possibly because I was using an expansion row but even copying and pasting the example does not close correctly. I do see from the demo site that it does in fact work as expected however, even creating the demo, I cannot get the context menu to go away.

taguan commented 5 years ago

Same issue with primeng 6.1.4, the context menu doesn't get away when right clicking, resulting in multiple context menus to be opened up at the same time

Tenmak commented 5 years ago

I have the same issue in 6.1.4 with angular 6.1.0. It is not even happening in a table or anything like that. No error, or nothing particular I missed in the documentation, while it behaves correctly on the PrimeNG official showcase of components.

Any leads or hints about this issue ?

Magister commented 5 years ago

@Tenmak are you using ChangeDetectionStrategy.OnPush? If yes, try Default one. Looks like PrimeNG's menu does not like OnPush strategy.

davidhorac3 commented 12 months ago

For anyone bumbing into this issue - which was never solved.

I've added both left and right click events and forcing context menu closing: `
@HostListener('document:contextmenu', ['$event']) rightClickAny() { this.ctx.hide(); }

@HostListener('document:click', ['$event'])
leftClickAny() {
    this.ctx.hide();
}

`

While opening on rightClick is:

rightClick(menu: ContextMenu, event: MouseEvent, item) { menu.hide(); event.preventDefault(); setTimeout(() => { menu.toggle(event); }, 1); }

... not sure why GitHub has such messy code blocks. -_- whatever, just leaving it as is