How to close Dropdown when user click on one item? #1870
-
|
hey Guys! |
Beta Was this translation helpful? Give feedback.
Replies: 2 comments 4 replies
-
|
If Using Method 1 from the docs (
|
Beta Was this translation helpful? Give feedback.
-
|
What if I want to have the behavior from Method 2 in which the dropdown closes when clicking outside and when an item inside the dropdown is selected? |
Beta Was this translation helpful? Give feedback.
-
|
Bit of a hack-y solution, but having an invisible button like
|
Beta Was this translation helpful? Give feedback.
-
|
In svelte you can do it like this <script lang="ts">
let openDropdown: boolean = false
function handleClickItem() {
// close it
openDropdown = false
}
</script>
<details class="dropdown" bind:open="{openDropdown}">
<summary class="m-1 btn">open or close</summary>
<ul class="p-2 shadow menu dropdown-content z-[1] bg-base-100 rounded-box w-52">
<li>
<a on:click={handleClickItem}>Item 1</a>
</li>
<li>
<a on:click={handleClickItem}>Item 2</a>
</li>
</ul>
</details> |
Beta Was this translation helpful? Give feedback.
-
|
This works, but in my case I am trying to use a dropdown lookup under an input field, in which case I can't use |
Beta Was this translation helpful? Give feedback.
-
|
The solution for me was adding e.currentTarget.blur(); to the onclick |
Beta Was this translation helpful? Give feedback.
If Using Method 1 from the docs (
<details>tag):