onclick sometimes trigger once and twice for it to activate in codeigniter

Asked Jan 04 '22 at 11:17

Active Jan 04 '22 at 12:55

Viewed 22 times

I had this kind of scenario that I wanted for it to happen, this is when I click the button, there would be a drop down list that will appear, and if i click outside of it, it would collapse automatically.

My main problem is that, that button after clicking once, it had to be clicked twice for the dropdown list to appear.

let settingsmenu = document.querySelector(".settings-menu");
function settingsMenuToggle() {
  document.addEventListener('click', function() {
    settingsmenu.classList.toggle("settings-menu-height");
  })
}

#coverphoto, #profilephoto, .userpic{
    height: 100%;
    width: 100%;
}

<ul style="right:10px; top:0px; margin-top:4px; margin-bottom: 5px;" class="navbar-nav ml-auto position-fixed end-50 ">
  <li style="position:relative;" class="nav-item dropdown">
    <a class="nav-link " role="button" onclick="settingsMenuToggle()">
      <img src="<?php echo base_url();?>assets/image/user.png" width="40" height="40" class="userpic rounded-circle position-absolute">
    </a>
    <div class="dropdown-menu">
      <a href="<?php echo base_url();?>pages/view/setting">Settings</a>
      <a href="#">Customization</a>
      <a href="<?php echo base_url();?>pages/view/logout">Logout</a>
    </div>
  </li>
</ul>

edited Jan 04 '22 at 12:55

asked Jan 04 '22 at 11:17

Laxus

I made you a snippet. Please add relevant HTML and CSS to make a [mcve] – mplungjan Jan 04 '22 at 11:22
But first [search for dupes](https://www.google.com/search?q=click+open+click+outside+site:stackoverflow.com) – mplungjan Jan 04 '22 at 11:24
my main problem is that if you click the button, at first click it is fine, but after that you need to click twice for it to appear – Laxus Jan 04 '22 at 11:26
I cannot verify this without relevant code – mplungjan Jan 04 '22 at 11:27
so to explain my code, there is a button that when clicked, it runs the settingsMenuToggle that expands and collapse the dropdown menu. should i include also the css? – Laxus Jan 04 '22 at 11:32
Yes. Code tells more than a thousand words – mplungjan Jan 04 '22 at 11:33
i have added the css code under the userpic used in img src – Laxus Jan 04 '22 at 12:55
But where is the settingsmenu ? – mplungjan Jan 04 '22 at 13:38

onclick sometimes trigger once and twice for it to activate in codeigniter

0 Answers0