Holiday Notice: Support will be provided on a limited scale from December 24th, 2024, to January 2nd, 2025. Happy holidays and a wonderful New Year!


Topic: Is there any way to keep a dropdown menu open after selecting an element ?

AchilleT pro asked 6 years ago


Is there any way to keep the a dropdown menu open after selecting an element?

i would like to keep my dropdown open and allow the user to select more options even to type some keywords for filtering. 

i want something similar to this 

http://jsfiddle.net/wt5s3L4s/

Thank you in advance :)


Jakub Mandra staff answered 6 years ago


Hi,

I think multiple select would fit your needs.

You can turn on the search input inside - it filters out options.

Use `<MDBSelectOptions search>` to achieve that.

Also, if you look into API section, you will find out much more options.

 

Best,

Jakub


AchilleT pro commented 6 years ago

Hi Jakub, 

I thank you very much for responding to my post.

I thought the same thing but the select will be an input and not a button. I thought I could do the same thing as on airbnb here(on this picture): 

https://drive.google.com/file/d/1KEOeyOArPH6uKUWPaGqLlOjy96HS3Yh7/view?usp=sharing

Regards,

Achille

 

 


Jakub Mandra staff commented 6 years ago

We dont't have component like that in the set, but I belive that this could be done by just puting your content into DropdownItem and modifying  classes in
.dropdown-menu .dropdown-item.acitve {}
(item changes backgorund on hover and on click).

Set toggle={false} property inside DropdownItem to prevent dropdown from closing.

By the way - this looks like a cool stuff to implement in our package, I will send it further to our design team.



Please insert min. 20 characters.

FREE CONSULTATION

Hire our experts to build a dedicated project. We'll analyze your business requirements, for free.

Status

Answered

Specification of the issue

  • ForumUser: Pro
  • Premium support: No
  • Technology: MDB React
  • MDB Version: 4.8.4
  • Device: laptop
  • Browser: chrome
  • OS: windows
  • Provided sample code: No
  • Provided link: Yes