Topic: disable input with mdbAutoCompleter
                  
                  t.kehl
                  premium
                  asked 3 years ago
                
I have an Input with an AutoCompleter like follow which I try to disable:
<input
type="text"
class="completer-input form-control mdb-autocomplete"
[disabled]="true"
[mdbAutoCompleter]="auto1"
[placeholder]="placeholder | translate" spellcheck="false"  />
<mdb-auto-completer #auto1="mdbAutoCompleter" textNoResults="..."  [clearButton]="false" [displayValue]="displayFn" [disabled]="true"> 
  <mdb-option *ngFor="let item of filteredUsers" [value]="item">
      {{item.displayName}}
  </mdb-option>
</mdb-auto-completer>
But now, only the autocompleter is disabled - the input is still enabled. How can I disable both: the input and the autocompleter?
                      
                      Arkadiusz Idzikowski
                      staff
                        answered 3 years ago
                    
For anyone having a similar problem, please add mdbInput directive to the input element. This directive should allow using [disabled] input and blocking the input element directly in reactive forms.
FREE CONSULTATION
Hire our experts to build a dedicated project. We'll analyze your business requirements, for free.
Resolved
- ForumUser: Premium
 - Premium support: Yes
 - Technology: MDB Angular
 - MDB Version: MDB4 10.1.1
 - Device: PC
 - Browser: Chrome
 - OS: Windows 10
 - Provided sample code: No
 - Provided link: No
 
Arkadiusz Idzikowski staff commented 3 years ago
@t.kehl It looks like a bug, we will take a closer look at that and let you know what we found. Do you use
ngModelor reactive forms withformControl?t.kehl premium commented 3 years ago
@Arkadiusz Idzikowski I use ngModel
Arkadiusz Idzikowski staff commented 3 years ago
@t.kehl As a workaround for now you can just add a
disabledattribute to the input:<input disabled />t.kehl premium commented 3 years ago
@Arkadiusz Idzikowski Thank you. How can I do this conditionally with a variable in the ts?
Arkadiusz Idzikowski staff commented 3 years ago
@t.kehl You can use this syntax:
[attr.disabled]="condition ? true : null"