Select Event Handler with TreeView

2 posts, 0 answers
  1. Margaret
    Margaret avatar
    3 posts
    Member since:
    Jun 2016

    Posted 08 Jul 2016 Link to this post


    When using the select event handler, I need to capture the id of the item that was clicked on, allow the user to click on a spot on the canvas (a different vendor's tool), and then draw the shape that the user chose at that location. Getting the id of the item is fine and the correct shape is drawn on the canvas. However, this happens when the item in the tree view is selected instead of when the user clicks on the canvas. I attached an event listener to the canvas using getElementById, but listener is triggered when the tree view item is selected and I'm not sure how to ensure that it only fires after the user clicks on the canvas.

    function onSelect(e) {
            // this refers to the TreeView object
            var dataItem = this.dataItem(e.node);
             document.getElementById("canvas").addEventListener("click", drawShape(, false);
    function drawShape(shape)
       var x = event.clientX;
       var y = event.clientY;
       //draw correct shape at target location


    Any suggestions?

    Thanks in advance.

  2. Dimitar
    Dimitar avatar
    356 posts

    Posted 12 Jul 2016 Link to this post


    The described scenario is not very clear to me. If you would like to prevent the TreeView node from selection, you may use the preventDefault method of the event argument - e.preventDefault();
    And in addition, why you are adding an event listener to the canvas inside the handler of the TreeView. It will be added on every node selection. You could add outside this handler. And inside the handler, you may trigger a click event for the canvas, which will execute the added canvas click handler.

    Telerik by Progress
    Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Feedback Portal and vote to affect the priority of the items
Back to Top