Topic: How can I show mat-select in modal ?

Omar free asked 4 years ago


How can I show mat-select in modal  after clicked I tried set mat-select into modal Bootstrap but can't show front model all time show behind model .    

Omar free answered 4 years ago


Fixed change modal bootstrap 4 to mat-modal-dialog.

Omar free answered 4 years ago


<mat-form-field >
<mat-selectplaceholder="Amenities" [formControl]="amenities"multiple [(ngModel)]="selectedValueAmenities">
<mat-option (click)="unselectAmenities()" style="color:inherit;"disabled>Clear</mat-option>
<mat-option *ngFor="let amenity of amenitiesList" [value]="amenity"style="display: block;">{{amenity}}</mat-option>
</mat-select>
</mat-form-field>


Arkadiusz Idzikowski staff commented 4 years ago

Dear Omar, The above code looks like Angular Material from Google. In case of problems with those components please contact their official support. Best, Arek

Biz free commented 4 years ago

It is not Angular Material error. I use mdb form field inside simple Bootstrap modal. Validation not working inside this modal. Validation for mbd inputs.
Modal components in mdb - not dynamic component. It is not Angular style.


Arkadiusz Idzikowski staff answered 4 years ago


Dear Omar, For me everything works fine. Did you add optionsSelect array to your component typescript file? Best, Arek

Omar free commented 4 years ago

yes,I did

Omar free commented 4 years ago

I couldn't showed mat-select into modal , after clicked . do you have solve to correct this problem ?

Omar free commented 4 years ago

If bootstrap 4 don't support for mat-select ?

Omar free commented 4 years ago

I want to send you snapshot but MDB ASK don't support this media .


Please insert min. 20 characters.

FREE CONSULTATION

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

Status

Resolved

Specification of the issue

  • User: Free
  • Premium support: No
  • Technology: MDB Angular
  • MDB Version: -
  • Device: -
  • Browser: -
  • OS: -
  • Provided sample code: No
  • Provided link: No
Tags