Topic: DropDown API Options not working
Anas Qiblawi free asked 3 years ago
for Example if I added this attribute
data-mdb-autoClose="outside"
Expected behavior
the dropdown list shouldn't close unless i tap outside it
Actual behavior
It closes whether I tap on it or outside of it
Code
<div class="dropdown">
<a class="dropdown-toggle d-flex align-items-center hidden-arrow float-end" href="#" id="AvatarDropdownMenuLink" data-mdb-autoClose="outside" role="button" data-mdb-toggle="dropdown" aria-expanded="false">
<img src="https://mdbootstrap.com/img/new/avatars/2.jpg" class="rounded-circle" height="30" alt="" loading="lazy" />
</a>
<ul class="dropdown-menu dropdown-menu-end border" aria-labelledby="AvatarDropdownMenuLink">
<li>
<a class="dropdown-item" href="#">My profile</a>
</li>
<li>
<a class="dropdown-item" href="#">Settings</a>
</li>
<li>
<a class="dropdown-item" href="#">Logout</a>
</li>
</ul>
<div class="dropdown">
Resources (screenshots, code snippets, etc.)
https://mdbootstrap.com/docs/standard/components/dropdowns/#docsTabsAPI
Dawid Wajszczuk staff answered 3 years ago
Hi,
Try using data-mdb-auto-close="outside"
. Camelcase options are being used with JS options. For data attributes simply use kebab case. Here is the snippet: https://mdbootstrap.com/snippets/standard/d-wajszczuk/3299398#
Keep coding,
Dawid
FREE CONSULTATION
Hire our experts to build a dedicated project. We'll analyze your business requirements, for free.
Answered
- ForumUser: Free
- Premium support: No
- Technology: MDB Standard
- MDB Version: MDB5 3.9.0
- Device: ALL
- Browser: FireFox
- OS: ALL
- Provided sample code: No
- Provided link: Yes