Unable to disable checkbox in Ionic 3.4.2


#1

Hello,

I 'm trying to disable the checkbox untill the User enters the text in text field, but the Checkbox is never disable. Can some one help me on this? Appreciate your time

   <ion-list *ngFor="let fc of queFailCodes; let i = index;">
 <ion-item class="textbox">

                            <ion-label>
                                <ion-icon name="information-circle" (click)="showMoreInfoForAns('que', questn)"></ion-icon>
                                <strong>{{fc.failCode}}</strong>{{fc.failDesc}}
                            </ion-label>
                            <ion-checkbox [(ngModel)]="fc.failCodeSelected" [disabled]="fc.failCodeSelected ? 'true' : 'false' " (ionChange)="failCodeSelectedChanged(fc)"></ion-checkbox>
                        </ion-item>
   </ion-list>
//Function called 
failCodeSelectedChanged(item){
    if(item.assignee.name !== "" && item.reviewer.name !== "" && item.assigneeCompletionDate !== "" && item.reviewerCompletionDate !== "" && item.severity !== 0 && item.failureCompletionDate !== ""){
          item.failCodeSelected =  true;
          this.isChecked = true;
      } else{
          this.isChecked = false;
         item.failCodeSelected =  false;
      }
  } 

Let me know for further information.
Thanks,
Sandeep


#4

If you got this to work, the checkbox would be a black hole. You check it once, and then it would become disabled and you would be unable to check it. I’m going to assume that’s not what you want.

Some other observations:

Generally speaking, you don’t want both a change handler and a two-way [(ngModel)].

You seem to be reinventing the form validation wheel. Instead, I would suggest learning to use reactive forms. That way you can just do [disabled]="!form.valid" for your checkbox and lose all the unwieldy stuff in your change handler. Much cleaner.


#5

Thanks you very much for your quick reply! Let me explore on that