Datatable and tree table onBeforeHeaderMenu

Webix JS
#1

Hello,

I want to trap before MenuHeader is displayed to execute a sort on HeaderMenu items.
If I made the sort after the initialization of table, e.g. when I display a tooltip or some others operation, the sort is reverted.

But the event " onBeforeContextMenu" doesn’t working:
https://snippet.webix.com/gxa6pld6

Any solution ?

Regards

#2

FYI:
Example of sort for header menu (typescript).
const menuSelection = $$(“grid”).config.headermenu;
const menu = <webix.ui.menu>$$(menuSelection);
menu.data.sort(“value”, “asc”, “string”);

PS: But the problem is not how to execute sort. The problem is the persistence of sort or the event before we display the header menu.

#3

@EricR
hope this helps you

#4

Hello @intregal,

With more 30 column the people doesn’t found with placement.
I want to have sorted. The sort is not the issue, I can sort without any issue, but some operation remove the sort. That is why I want to sort just before I show the header menu. But the event doesn’t working.

I think that is a bug.

Regards

#5

Good day @EricR ,
The headermenu is based on ui.context only in terms of the structure and api of the menu (it is also a popup that is shown after mouse right click). It looks and behaves as if it is a “real” context menu.
However, the onBeforeContextMenu event works only with the ui.context, which can be connected for data, or the browser context menu. You can see that the event is actually working by right-clicking on the datatable cells and checking the console: Code Snippet .
To catch the moment before the headermenu is shown, you may use the onBeforeShow / onShow events.
Also, please, note that these handlers have to be set outside the headermenu:{ } config. Otherwise, they will interrupt the predefined handlers in on:{ } property.
Please, check the example: Code Snippet .

1 Like
#6

Good day @MariyaDemy

Thanks. I have also tested to attach to header menu component but not used beforeShow.
I have used this.
(<webix.ui.contextmenu>$$(this._dt.config.headermenu)).attachEvent(“onBeforeContextMenu”, () => {
console.log(“header menu before”);
});

Thanks with BeforeShow that working well.

PS: I think the documentation need to be updated to remove these event on Datatable and Treetable.

The doc:

Regards,