Search code examples
javascriptreactjsleafletleaflet-draw

How to append button into popup in leaflet draw?


I want button inside popup to make some action on popup attached layer.

 L.marker(coors[i], { icon })
          .addTo(this.drawnItem)
          .bindPopup(this._getCustomIcon(mix))
          .openPopup();

Below my _getCustomIcon()

 _getCustomIcon = value => {
    let delLayer = document.createElement("BUTTON");
    delLayer.innerHTML = "Delete";
    let CustomPopup = L.popup({ className: "customPopup" }).setContent(
      `<p> ${value}</p> ${delLayer}` //here is error
    );
    return CustomPopup;
  };

Solution

  • Just use this code

     _getCustomIcon = value => {
        let delLayer = document.createElement("BUTTON");
        delLayer.innerHTML = "Delete";
        return delLayer;
      };
    

    Your mistake is creating a popup after using bindPopup which already creates popup!