How to close popup when I click outside on popperjs?

Question

I am using popper js to show a pop up in my website. I want to close the popup when I click anywhere in window.

here is what I have tried:

var popp = $('#popp');
popp.hide();

$('#filters li i ').click(function () {
    var ref = $(this).val();

    $(this).toggleClass('text-danger')
    popp.toggle()

    var popper = new Popper(ref, popp, {
        placement: 'right',
    });
});

Possible duplicate of: https://stackoverflow.com/questions/49647386/popper-js-how-to-close-popup-when-clicking-outside — twain, Nov 11 '19 at 15:25

score 1 · Answer 1 · answered May 25 '20 at 08:31

What I did was to create a method that recieves a click, then check if this click happened inside the button, if it was he will show the tooltip, other wise he doesn't.

function tooltipClick(click){
  document.addEventListener(click, function(event) {
    let isClickInside = button.contains(event.target);

    if (isClickInside) {
      show();
    }
    else{
      hide();
    }
  });

}

How to close popup when I click outside on popperjs?

1 Answers1