onContextMenu y-axis


#1

I am using DHTMLXscheduler v4.3 in timeline mode. I have implemented the onContectMenu handler but it works on the whole component. I want to show different menu options depending on where the user clicks. I can identify if they click on an event or on whitespace but I cant find a way to determine if that whitespace is a section in the left side y-axis. I want to identify which row(section) was clicked in specifically in the left y-axix column. Any help would be appreciated.

Thanks


#2

Hello Trev,
To show the menu when it is called on the “event line”, you can check if there is an event id on click:

scheduler.attachEvent("onContextMenu", (eventId, nativeEventObj) => {
    if (eventId) {
        // menuEvent call
    }
}

To show another menu when it is called on the left side in the “sections” area, you can define the position of the cursor when clicked:

scheduler.attachEvent("onContextMenu", (eventId, nativeEventObj) => {
    var scellWidth = document.getElementsByClassName('dhx_matrix_scell')[0].clientWidth;
    if (nativeEventObj.clientX < scellWidth) {
        // menuSection call
    }
}

To determine in which “section” the click was made, you can use the scheduler.getActionData() method:

var actionData = scheduler.getActionData(nativeEventObj);
dhtmlx.message(`You clicked on section ${actionData.section}`);

You can also use dhx.ContextMenu for the context menu.

Here is a complete snippet: http://snippet.dhtmlx.com/5/e498a4497.