Topic: on disabled mdb-select [clearButton] is not disabled

ammi pro asked 1 year ago


Please disable clear button on disabled control. Any work around for now?

get optionVendor(): AbstractControl { return this.myForm.get('optionVendor')!};
this.optionVendor.disable();

<mdb-form-control>
                <mdb-select mdbValidate id="drpVendor" [clearButton]="true"
                  formControlName="optionVendor">
                  <mdb-option *ngFor="let option of vendorOptions" [value]="option.value">{{
                    option.label
                    }}</mdb-option>
                </mdb-select>
                <label mdbLabel class="form-label" for="drpVendor">Vendor Name</label>
              </mdb-form-control>

it disables control but clear button still works.Thanks


Rafał Seifert free commented 1 year ago

Could you edit your post and provide sample code how you implement your template? So we can recreate your problem. Did you try to use [disabled] input of mdb-select component?


ammi pro commented 1 year ago

post was updated to include html. Using [disabled] on reactive form is not recommended.


Arkadiusz Idzikowski staff answered 10 months ago


This problem was fixed in v6.0.0. Please update your MDB Angular version.


Rafał Seifert free answered 1 year ago


I am confirming that it is a bug on our side. For now you can try to create a helper function :

setClearButton(): boolean {
    return this.optionVendor.disabled ? false : true;
  }

and in template set the clearButton input dynamically like this:

<mdb-form-control>
  <mdb-select mdbValidate id="drpVendor" [clearButton]="setClearButton()" formControlName="optionVendor">
    <mdb-option *ngFor="let option of vendorOptions" [value]="option.value">{{
      option.label
    }}</mdb-option>
  </mdb-select>
  <label mdbLabel class="form-label" for="drpVendor">Vendor Name</label>
</mdb-form-control>


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

  • ForumUser: Pro
  • Premium support: No
  • Technology: MDB Angular
  • MDB Version: MDB5 4.1.0
  • Device: Laptop
  • Browser: Chrome
  • OS: W10
  • Provided sample code: No
  • Provided link: No