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-2 Problems in the list opening position

Wanderson pro asked 1 year ago


Expected behavior When selecting a certain item in the selection box and when opening it again to select another item, the box must bring the previously selected item visible Actual behavior When selecting a certain item in the selection box and opening it again to select another item, the box always moves to the end, which greatly hinders usability. Resources (screenshots, code snippets etc.) enter image description here enter image description here enter image description here


Arkadiusz Idzikowski staff commented 1 year ago

I tried to reproduce this bug on my end but it looks like everything is working as expected.

Could you please edit your post and provide an example HTML/TS code on which I will be able to reproduce the problem?


Wanderson pro commented 1 year ago

The component has problems when changing the optionHeight property.

In my case it is set to 35.

<div class="md-form md-outline">
  <mdb-select-2 [outline]="true" placeholder="Choose your option" label="Example label" optionHeight="35">
    <mdb-select-filter [ngModel]="searchText | async" (ngModelChange)="searchText.next($event)">
    </mdb-select-filter>
    <mdb-select-option *ngFor="let option of filteredOptions | async" [value]="option.value">{{ option.label }}
    </mdb-select-option>
  </mdb-select-2>
</div>

Wanderson pro commented 1 year ago

The mdb-auto-completer component has the same problem.



Please try to change the optionHeight syntax to [optionHeight]="35". It looks like there is a problem with automatic type coercion from string to number.


Wanderson pro commented 1 year ago

It worked, thank you



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 Angular
  • MDB Version: MDB4 15.0.0
  • Device: ALL
  • Browser: ALL
  • OS: ALL
  • Provided sample code: No
  • Provided link: No