Start Building Professional
Web Apps Today

Node or mouse click position on right click event

Hi,

Is it possible to detect node or mouse click position on right click event?
What I'm trying to do is to display some text on a floating div next to the node (eg. similar to a tooltip) when user right clicks on a node.

Currently I have something like the following:

function initTree() {
...
myTree.setOnRightClickHandler(nodeRightClicked);
...
}

function nodeRightClicked() {
displayText("some text", positionX, positionY);
}

where positionX and positionY are the X and Y 'coordinates' (of the top left corner) where the floating div will be displayed

I tried to use e.clientX and e.clientY but both values are null/undefined

thank you in advance

If you are using latest version of dhtmlxtree, the event object accessible as second parameter of event handler


myTree.setOnRightClickHandler(nodeRightClicked);
function nodeRightClicked(id,ev) {
    //ev - event object
    displayText("some text", ev.clientX, ev.clientY);
}

I have the same problem.
But your solution does not work for me.
I have the latest Enterprise version of dhtmlxTree but I am getting "undefinded" for both "clientX" and "clientY" when trying your solution.
What else can I check?

Which browser you are using?
The same code works correctly with latest codebase in both IE and FF ( sample attached )

Thanks for your prompt reply.
I  was not very precise. Sorry for that.
I am using both FF3 and IE7.
I got your example working now.
Of course I had to remove the ContextMenu since the right clicks interfered.

But .... what I need is to get the position on a LeftClick.
Your example is only working with "setOnRightClickHandler" but neither with "setOnClickHandler" nor with "setOnDblClickHandler".
And I stripped my code to the basic commands.
What am I doing wrong?

By the way:
This is what I am trying to realize:
I have a form next to my tree that gets the name of the node the user clicks/selects in the tree to the left.
But when the tree is kind of long I have to scroll down.
So I want the form to the right to be / to jump on the same horizontal line of the node I left-clicked/selected.

Thanks again

The onClick and onDblClick events do not provide information about exact position of click.
You can
a) modify source code of tree, to get such info

dhtmlxtree.js, line 1633 in latest code
    else that.callEvent("onClick",[obj.id,lastId]);
can be replaced with
    else that.callEvent("onClick",[obj.id,lastId,e]);

In such case third parameter of event will be DOM event object.

b) you can use next code to get position of item by its id
     var z=getAbsoluteTop(this._idpull[ID].htmlNode)-getAbsoluteTop(this.allTree);
where ID - id of item