Topic: MDB-Select in a Modal

claust free asked 4 years ago

MDB Pro Select to be working and opening dropdown on click.

Clicking on MDB-Select in modal does not open. Closing modal and opening again shows the dropdown options. But once clicked it won't open again. Also the following error is seen after clicking select a few times.

zone-evergreen.js:172 Uncaught TypeError: Cannot read property 'clearFilterInput' of undefined at SelectComponent.clearFilterInput (ng-uikit-pro-standard.js:17123) at SelectComponent.closeDropdown (ng-uikit-pro-standard.js:17019) at ng-uikit-pro-standard.js:16996 at HTMLDocument. (platform-browser.js:934) at ZoneDelegate.invokeTask (zone-evergreen.js:400) at Zone.runTask (zone-evergreen.js:168) at ZoneTask.invokeTask [as invoke] (zone-evergreen.js:481) at invokeTask (zone-evergreen.js:1596) at HTMLDocument.globalZoneAwareCallback (zone-evergreen.js:1633)

Konrad Stępień staff commented 4 years ago

Hi @claust,

Without the code, I can't help you. Can you provide part of your code to me?

tano pro commented 4 years ago

.cdk-overlay-connected-position-bounding-box, .cdk-overlay-container, mdb-select-dropdown .dropdown-content { z-index: 1100; } This helped me out. z-index issue. The cdk* for mdb-select-2 to display select in sidenav and modal, the mdb* for mdb-select to display in modal and sidenav.

tano pro commented 4 years ago

I've experienced the same. I've tried the old and the new versions too. The select combo is not visible in modal. My version:9.3.0

Konrad Stępień staff commented 4 years ago

Hi @bitjuice,

Could you send part of code and screen shots?

@tano this solution fix the issue or do you have sill some problems?

bitjuice pro commented 4 years ago


I have the same problem. With previous version of mdb-select I solved it by setting [appendToBody] attribute to true and by setting z-index to a very high value

.dropdown-content {
    z-index: 1500;

mdb-select 9.3.0 version hasn't [appendToBody] attribute.

How I can solve this problem?


tano pro commented 4 years ago


It solved.



Please insert min. 20 characters.


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



Specification of the issue

  • ForumUser: Free
  • Premium support: No
  • Technology: MDB Angular
  • MDB Version: 9.0.0
  • Device: Windows PC
  • Browser: Chrome
  • OS: Win 10
  • Provided sample code: No
  • Provided link: No