jeudi 25 juillet 2019

How do I clear the checkbox check? The value is being cleared

I have two checkboxes which help filter data. I have a function which clears the filter, but the checkboxes remain checked.

I tried ngModel, but with no success.

<label class="filterlable" for="">Other:</label>&nbsp;&nbsp;
                    <label><input id="CPRBox" type="checkbox" [value]="3" [checked]="CPRBox" (change)="includeOthers(3)">&nbsp;CPR Certified&nbsp;</label>
                    <label><input id="NotaryBox" type="checkbox" [value]="2" [checked]="NotaryBox" (change)="includeOthers(2)">&nbsp;Notary&nbsp;</label>

This sets the value when the box is clicked:

includeOthers(id): void {
    const index = this.otherArray.indexOf(id);
    if (index == -1) {
      this.otherArray.push(id);
    } else {
      this.otherArray.splice(index, 1);
    }
    this.addQueryParams({ other: this.otherArray.length > 0 ? this.otherArray.toString() : null })
  }

This clears the filter, but the box(es) remain checked.

clearFilters() {
    this.otherArray = [];
    this.CPRBox = false;
    this.NotaryBox = false;
  }

When clearFilters() runs, the checkboxes should no longer be checked.

Right now, the filters are cleared, but the boxes remain checked. Which means, when the user clicks on the boxes a 2nd time, the filters are enabled, but the boxes are not checked, leading to a confusing state of the filter.




Aucun commentaire:

Enregistrer un commentaire