Topic: Select+Search = Jumping dropdown

smoehrle free asked 2 years ago


Reproduce by:

  1. Click on the link below
  2. Adjust the height of the first div such that the dropdown menu with all available options is above the input
  3. Enter something in the search bar

Expected behavior

The dropdown should stay above the input since this is where it spawned.

Actual behavior

The dropdown resizes and when there is enough space it will jump under the input

Resources (screenshots, code snippets etc.)

https://mdbootstrap.com/snippets/standard/smoehrle/2781343#html-tab-view

Best regards


Arkadiusz Idzikowski staff answered 2 years ago


This is the expected behavior. We intentionally dynamically update the dropdown position to avoid a situation in which the list of options is not fully displayed on the screen due to its height after filtering.


smoehrle free commented 2 years ago

I understand that the height is determined dynamically if you open the dropdown. But after it is displayed the results can get only less by filtering. At least for the static list case. So your described situation cannot occur.


Arkadiusz Idzikowski staff commented 2 years ago

@smoehrle
We understand that there are use cases where this functionality may not be useful, so we will add options to disable it.


smoehrle free commented 2 years ago

Thanks!

Best regards


smoehrle free commented 2 years ago

Has this option been added yet? I couldn't find anything in the changelog


Grzegorz Bujański staff commented 2 years ago

Unfortunately this option has not been added yet.



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

  • User: Free
  • Premium support: No
  • Technology: MDB Standard
  • MDB Version: 2.2.1
  • Device: any
  • Browser: any
  • OS: any
  • Provided sample code: No
  • Provided link: Yes