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: Mdb-select searchable issue when hace scroll bar

webdesigna free asked 3 years ago


Expected behavior ERROR: SEARCH INPUT HIDDEN ON TOP when not have a disabled and selected option . Need scroll top top to show search input OK: SEARCH INPUT SHOW OK when have a disabled and selected option Actual behavior

Resources (screenshots, code snippets etc.) https://mdbootstrap.com/snippets/jquery/webdesigna/2853571#html-tab-view


webdesigna free answered 3 years ago


But if i need edit any form with one option selected, i need scroll up to go to search input for change this input to other option. It is a problem in select with large data options on edit forms. Can i show input search always?


Marcin Luczak staff commented 3 years ago

Hi,

Unfortunately, this is not officially supported. You can however achieve this functionality with some custom styles added to the search selector. Please see my snippet showing how you can customize the search area for the select component: https://mdbootstrap.com/snippets/jquery/marcin-luczak/2869538. Please note that this is a custom functionality and it might not work properly in every project.

Regards, Marcin


Marcin Luczak staff answered 3 years ago


Hi @webdesigna,

This is normal behavior for the select to focus on its first <option> element. Because we dynamically add content to the searchable select, without adding disabled selected option search bar will be omitted and you will have to individually scroll up to make it visible. It is in our documentation and it's not an error.

Best, Marcin



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: Free
  • Premium support: No
  • Technology: MDB jQuery
  • MDB Version: 4.19.2
  • Device: All
  • Browser: All
  • OS: All
  • Provided sample code: No
  • Provided link: Yes