How to alert data when bootstrap5 dropdown menu is closed-CodePudding

Am trying to alert data when Bootstrap5 Dropdown menu is closed but cannot get it to work. Below is what i have tried

 <div >
  <button type="button"  data-bs-toggle="dropdown">
    Dropdown button
  </button>
  <ul >
    <li><a  href="#">Link 1</a></li>
    <li><a  href="#">Link 2</a></li>
    <li><a  href="#">Link 3</a></li>
  </ul>
</div> 




$('.dropdown-menu').on("hide.bs.dropdown", function () {

   alert('Dropdown Menu is closed');               
});

CodePudding user response：

It is not working because you are trying to run the function on ul elements, where as you should be running the eventlistenner on button element. I would suggest you to use id on that particular dropdown element.

$('.dropdown-toggle').on("hide.bs.dropdown", function () {
   alert('Dropdown Menu is closed');               
});

Here is the working example for your code. I have just added the id to the button element.