This is a migrated thread and some comments may be shown as answers.

Stop event propagation

3 Answers 39 Views
Map
This is a migrated thread and some comments may be shown as answers.
Sam
Top achievements
Rank 1
Sam asked on 10 Oct 2019, 08:13 PM
I have a map with functions defined for the Click and MarkerClick events. If the marker is clicked, i do not want to execute the map click as well.  I tried using the stopPropagation() method but it's apparently not defined for the object passed to the event handler  function.  How can I do this with these events?

3 Answers, 1 is accepted

Sort by
0
Peter Milchev
Telerik team
answered on 14 Oct 2019, 01:17 PM

Hello Sam,

The MarkerClick event does not provide a reference to the DOM object which is the reason it cannot be prevented from propagation. 

Nevertheless, you can add a flag as an expando property of the Map object and access it in the click event as demonstrated in this Dojo example:

            click: function(ev) {
              if(!ev.sender.__isMarkerClicked){
                console.log("click");
              }

              ev.sender.__isMarkerClicked = false;
            },
            markerClick: function(ev) {
              console.log("markerClick");
              ev.sender.__isMarkerClicked = true;
            }

Regards,
Peter Milchev
Progress Telerik

Get quickly onboarded and successful with your Telerik and/or Kendo UI products with the Virtual Classroom free technical training, available to all active customers. Learn More.
0
Sam
Top achievements
Rank 1
answered on 15 Oct 2019, 03:52 PM
Thanks Peter.  Is there a method to do this with the MVC helper? 
0
Peter Milchev
Telerik team
answered on 17 Oct 2019, 08:46 AM

Hello Sam,

The MVC helper produces HTML and JavaScript that would actually build and create the Kendo UI widget. 

With that said, the same handlers can be used to achieve the same result:

      .Events(events => events
          .Click("onClick")
          .MarkerClick("onMarkerClick")
      )

function onClick(ev) {
    if(!ev.sender.__isMarkerClicked){
        console.log("click");
    }

    ev.sender.__isMarkerClicked = false;
}
function onMarkerClick(ev) {
    console.log("markerClick");
    ev.sender.__isMarkerClicked = true;
}

Regards,
Peter Milchev
Progress Telerik

Get quickly onboarded and successful with your Telerik and/or Kendo UI products with the Virtual Classroom free technical training, available to all active customers. Learn More.
Tags
Map
Asked by
Sam
Top achievements
Rank 1
Answers by
Peter Milchev
Telerik team
Sam
Top achievements
Rank 1
Share this question
or