Leaflet popupclose event fires whilst dragging marker

Question

In my app I add a temporary dragable marker to a map and open its popup. I found that when the marker is dragged the popup closes. To get around this I added the code as per Force Leaflet popup to stay open when a draggable marker is moved

var marker = new L.Marker([setLat, setLng], {icon:questionIcon, draggable:true});
marker.bindPopup("popup content").addTo(map).openPopup();
marker.on('dragend', function(e) { 
    marker.openPopup();
});

However, I also want to make sure that if the user closes the popup manually (using the standard 'x' top-right) that the temporary marker is removed from the map. So I added ...

marker.on('popupclose', function(e) {
    map.removeLayer(marker);
});

... but, this also fires when dragging the marker. So as soon as the user tries to reposition the marker by dragging it, it completely disappears.

Is there a way to distinguish between the two events so I can handle them differently? Or back to the original question, disable the popupclose from happening when the marker is dragged?

Answer 1

I met the same issue , and I solved it by doing this inorder to distinguish between the two events :

marker._popup._closeButton.onclick = function( ){
    console.log("click closed "); 
    map.removeLayer(marker);
}

http://jsfiddle.net/Zoubir/v71Lhn5s/

Answer 2

I met the similar issue. Here's my solution

var IsDragging = false;

marker.on('dragstart', function (event) {
    IsDragging = true;
});

marker.on('dragend', function (event) {
    marker.openPopup();
    IsDragging = false;
});

map.on('popupclose', function(e) {
    setTimeout(function(){
        if(LS.Send.IsDragging == false){
            map.removeLayer(LS.Send.Marker);
        }
    },300);
});