jeudi 11 avril 2019

To select only one checkbox at a time and execute a particular task on a particular checkbox being selected or both of the checkboxes being unchecked

I have two checkboxes and the objective is to only allow one checkbox to be selected at a time Further different task needs to be executed depending on either selection of a particular checkbox or in case both of the checkboxes are unchecked. I have implemented this and facing issue in executing the task when one of the checkboxes are checked or both are unchecked

    <div *ngFor="let chk of checkboxes">
    <input type="checkbox" [checked]="chk.checked" 
    (click)="uncheckOther(chk)"> 
    </div>
==
    checkboxes = [{ checked: false, value: 'Request' }, { checked: false, 
    value: 'Reservation' }];    

  uncheckOther(chk) {
   //uncheck all
   this.checkboxes.forEach(x => {
   if(x.checked == true)
   x.checked = false;
  })

  //check the selected
   if(chk.checked == true) {
   chk.checked = false; 
    } else {
   chk.checked = true;
   }
//Execute task if any one of the checkboxes are selected
   if(chk.value === "Request" && chk.checked == true){
    console.log("call request data")
   } else if(chk.value === "Reservation" && chk.checked == true){
    console.log("call Reservation data");
   }
//Execute task if none of them is checked
   this.checkboxes.forEach(x => {
   if(x.checked === false)
   console.log("call both combined data")
   })
   }

Only one checkbox should be selected at a time and some tasks needs to be executed depending on the selected checkbox or both of the checkboxes being unchecked which is also the default case(or might be unchecked by the user)




Aucun commentaire:

Enregistrer un commentaire