vendredi 11 juin 2021

Checkbox not getting checked/unchecked as expected

I have a list of checkboxes as shown below:

<div class="col-md-4 md-padding-s"  *ngFor="let node of nodeList; let j=index;">
                  <md-checkbox-group>
                    <md-checkbox
                      class="md-h6 row md-padding--xs"
                      name=""
                      label=""
                      value=""
                      required="true"
                      htmlId="filter_label__"
                      (ngModelChange)="updateSelection(node)"
                      [formControlName]="servers"
                      [(ngModel)]="node.selected">
                    </md-checkbox>
                  </md-checkbox-group>
                </div>

My updateSelection function is .ts file is:

  updateSelection(node) {
         console.log('node', node)
        node.selected = node.selected ? false : true;
        if(node.selected) {
          this.serverList.push(node.FQDN);
          this.isServerSelected = true;
        }else{
          this.serverList.pop();
          this.serverList = this.serverList.filter((x, i, a) => a.indexOf(x) == i)
          if(this.serverList.length == 0) {
            this.isServerSelected = false;
            this.alertService.error('Error', 'Please select atleast 1 server', this.alertConfig);
          }
        }
    }

Now, the checkbox has to be checked or unchecked based on node.selected value. But what is happening is when I click on the checkbox text the node.selected value has to change based on updateSelection function which is currently happening. But the checkbox is not getting checked or unchecked when I click on the surrounding text. Only if I click on the checkbox , the value is getting checked/unchecked. Where am I going wrong?




Aucun commentaire:

Enregistrer un commentaire