Topic: mdb-select-2 not showing any values in dropdown
Expected behavior List values in dropdown Actual behavior Not listing values in dropdown
Resources (screenshots, code snippets etc.)
options = [ { value: '1', label: 'Option 1' }, { value: '2', label: 'Option 2' }, { value: '3', label: 'Option 3' }, ];
{{ option.label }}
hello, is there anything new on solving the problem of mdb-select-2 on mdb-modal, thank you
Same problem here. Here is a code example (for my case):
<div class="md-form" *ngIf="countries | async as countries">
<mdb-select-2 placeholder="Country code">
<mdb-select-option *ngFor="let country of countries" [value]="country.phoneCode">{{ country.isoName }} ( {{country.phoneCode}} )</mdb-select-option>
</mdb-select-2>
</div>
The dropdown doesn't even open.
Konrad Stępień staff commented 11 months ago
Could you also provide code of ts file?
Or, please provide to mi a working example.
Stefan Stefanov pro premium commented 11 months ago
I found something. Currently, I'm using mdb-select-2 in mdbModal and it doesn't work, but when I extract mdb-select-2 and paste it in normal component everything is fine (it's working properly).
Arkadiusz Idzikowski staff commented 11 months ago
Thanks, we will try to debug that using modals.
fellah pro commented 10 months ago
Hi Arek
how's the investigation going? I'm facing the same problem, the select doesn't open within a modal
Arkadiusz Idzikowski staff commented 10 months ago
This issue is still not resolved, we will update this thread when we will find a workaround or add a fix.
rhaouari commented 10 months ago
Hi , my mdb pro license expired a few days ago , if this issue is fixed , in a newer version, will i be able to get the update ?
actually the dropdown works but its hidden by the cdk-overlay-container div i added this to styles.scss and it seems to resolve the problem
.cdk-overlay-container { z-index: 1050 !important; } i m not a css fan , i don't know if the solution is adequate , but did'nt see any regression in my app after modifying the scss.
Arkadiusz Idzikowski staff commented 9 months ago
We need to adjust z-indexes of some elements to achieve the same effect, so this solution might be correct, but we need to check if it doesn't break anything in other components.
soumadeep pro premium commented 2 weeks ago
Hi Arkadiusz
Any updates on this?
Arkadiusz Idzikowski staff commented 2 weeks ago
@soumadeep We added fix in v9.4.0. Do you use this (or newer) version and still have the same problem? Do you also use select inside a modal component?
Answered
- User: Free
- Premium support: No
- Technology: Angular
- MDB Version: 9.3.1
- Device: PC
- Browser: Firefox
- OS: Windows 10
- Provided sample code: No
- Provided link: No
Arkadiusz Idzikowski staff commented 11 months ago
Please provide the html code that you used to render the component. Does the dropdown open correctly?