CODEWITHSUNDEEP
angularionic-framework
Sahil
Sahil

Reputation: 553

how to disable ionic form field depending on other form field values?

there is one ion select

 <ion-select interface="popover" formControlName="window_exists"  (ionChange)="openWindow()" type="text">
          <ion-option value="Y">Yes</ion-option>
          <ion-option value="N">No</ion-option>
        </ion-select>

i want to disable ion input if ion-option value is "NO"

 <ion-input   type="number" min="0" formControlName="ml_window_no" required clearInput></ion-input>

please guide

Upvotes: 1

Views: 990

Answers (1)

AddWeb Solution Pvt Ltd
AddWeb Solution Pvt Ltd

Reputation: 21681

You, need to pass $event as a parameter,

<ion-select interface="popover" formControlName="window_exists"  (ionChange)="openWindow($event)" type="text">
  <ion-option value="Y">Yes</ion-option>
  <ion-option value="N">No</ion-option>
</ion-select>

And, add a disabled property like this,

<ion-input disabled="{{isDisabled}}" type="number" min="0" formControlName="ml_window_no" required clearInput></ion-input>

Now, you have to add this code in .ts file,

isDisabled:boolean = false;

openWindow(event){
     console.log('event',event);
     if (event == 'N') {
       console.log('no');
       this.isDisabled = true;
     }else{
       console.log('yes');
       this.isDisabled = false;
     }
}

Thanks.

Upvotes: 2

Related Questions