How to prevent dropdown close on menu item click

Question

how to prevent dropdown menu close on menu item click. I tried to do something but it does not work.

<script>
// Do not close dropdown on menu item click
$(document).on('click', '.list-dropdown', function (e) {
    e.stopPropagation();
});

Fixed with line: onclick="event.stopPropagation();"

Try giving e.preventDefault(); to avoid default property of that dropdown. — Hema Nandagopal, Jun 27 '17 at 07:16
Possible duplicate of [Twitter Bootstrap - Avoid dropdown menu close on click inside](https://stackoverflow.com/questions/25089297/twitter-bootstrap-avoid-dropdown-menu-close-on-click-inside) — Chris, Jun 27 '17 at 07:17
@HemaNandagopal e.preventDefault(); I tried but it does not work. — Paulius Jasiulis, Jun 27 '17 at 07:21
@Chris I saw this post but it does not work me or I writed something wrong. — Paulius Jasiulis, Jun 27 '17 at 07:23

score 0 · Answer 1 · answered Jun 27 '17 at 08:09

0

Use this where you have e.stopPropagation:

e.preventDefault();
return true;

answered Jun 27 '17 at 08:09

Chris Halcrow

28,994
18
176
206

score 0 · Answer 2 · answered Jun 27 '17 at 08:33

0

Stop propagation prevents the event from propagating to other methods. But what you are looking to do here, is stop the default behaviour (which is close the menu).

Your code should look like the following:

<script>
// Do not close dropdown on menu item click
$(document).on('click', '.list-dropdown', function (e) {
    e.preventDefault();
});
</script>

answered Jun 27 '17 at 08:33

amilete

106
3

But it does not work for me. Only this one work: onclick="event.stopPropagation();" – Paulius Jasiulis Jun 27 '17 at 08:46
That then means that the element who is closing the dropdown is not the `.list-dropdown` but some other – amilete Jun 27 '17 at 08:49

How to prevent dropdown close on menu item click

2 Answers2