Disable feature popup when creating new simple marker

Question

I have a leaflet map with some loaded polygon layers. When using the Simple Markers plugin, i would like to create a new marker on top of an already existing polygon feature, but i can only click the feature (which brings up the popup with information) and not place the marker on top of the feature. It works fine on an empty piece of the map.

Is it possible to disable the feature popup when the Simple Marker function is running?

L.Control.SimpleMarkers = L.Control.extend({
    options: {
        position: 'topleft'
    },

    onAdd: function () {
        var marker_container = L.DomUtil.create('div', 'marker_controls');
        var add_marker_div = L.DomUtil.create('div', 'add_marker_control', marker_container);
        add_marker_div.id = 'add_marker_div_id';
        add_marker_div.title = 'Add a new Note';
        L.DomEvent.addListener(add_marker_div, 'click', L.DomEvent.stopPropagation)
            .addListener(add_marker_div, 'click', L.DomEvent.preventDefault)
            .addListener(add_marker_div, 'click', (function () { this.enterAddMarkerMode() }).bind(this));

        return marker_container;
    },

    enterAddMarkerMode: function () {
        if (markerList !== '') {
            for (var marker = 0; marker < markerList.length; marker++) {
                if (typeof(markerList[marker]) !== 'undefined') {
                    markerList[marker].removeEventListener('click', this.onMarkerClickDelete);
                } 
            }
        }
        document.getElementById('map').style.cursor = 'crosshair';
        document.getElementById('add_marker_div_id').style.backgroundColor = '#b0c4de';
        map.addEventListener('click', this.onMapClickAddMarker);
    },

    onMapClickAddMarker: function (e) {
        map.removeEventListener('click'); 
        document.getElementById('map').style.cursor = 'auto';
        document.getElementById('add_marker_div_id').style.backgroundColor = '#FFF';

        var popupContent =  "You added a note on the map at " + e.latlng.toString();
        var the_popup = L.popup({maxWidth: 160, closeButton: false});
        the_popup.setContent(popupContent);

        var marker = L.marker(e.latlng);
        marker.addTo(map);
        marker.bindPopup(the_popup).openPopup();
        markerList.push(marker);

        return false;    
    },
});
var markerList = [];

Edit:

I have added the features from a PHP file through the following code as a GeoJSON layer:

var exp_PolygonJSON = new L.geoJson(exp_Polygon,{
    onEachFeature: pop_Polygon,
    style: doStylePolygon
});

The popups are coming from:

function pop_Polygon(feature, layer) {                  
    var popupContent = '____Popup html code____';
    layer.bindPopup(popupContent);
}

Answer 1

You could unbind the popup from the polygons when entering marker mode enterAddMarkerMode, and then bind them again after adding a marker onMapClickAddMarker.

Without knowing how your polygons or popups are constructed, it is difficult to say exactly, but assume you have added polygons and saved them to a L.featureLayer() called polyFeatures:

// somewhere in enterAddMarkerMode() function
polyFeatures.eachLayer(function(layer){
    layer.unbindPopup();
});

// somewhere in onMapClickAddMarker() function
var popup = "Hi!";
polyFeatures.eachLayer(function(layer){
    layer.bindPopup(popup);
});

Answer 2

I managed to fix this issue in a whole different way than initially asked for.

Even when popups where not present (with unbindpopup) i was still not able to place a new marker on top of polygons.

The reason was that there was no custom event added to the polygonlayer that could respond to a click, the code only added such an event on the map.
So inside the 'enterAddMarkerMode' function, I added:

exp_PolygonJSON.addEventListener('click', this.onMapClickAddMarker);

And inside 'onMapClickAddMarker' :

exp_PolygonJSON.removeEventListener('click', this.onMapClickAddMarker);

That did the job for me. Hope this helps for future reference.