CODEWITHSUNDEEP
angularangular-material
Marc Roussel
Marc Roussel

Reputation: 509

Angular 14 mat-checkbox not clickable

I got an app that uses a schema to define the columns of an editable mat-table.

The problem is that when I click the pencil, the checkboxes aren't clickable. For more details, I suggest you go see the stackblitz project.

https://stackblitz.com/edit/angular-ivy-tjsqam?file=src/app/app.component.html

Code example :

<div *ngIf="col.key != 'isEdit'">
  <input
    [type]="col.type"
    [(ngModel)]="element[col.key]"
    [checked]="GetCheckBoxValue(element, col.key)"
  />

In not editing mode :

enter image description here

In editing mode :

enter image description here

Upvotes: 0

Views: 478

Answers (1)

Mr. Stash
Mr. Stash

Reputation: 3160

The example is in Angular 15

change the following thing, this should make the checkbox work

<tr
  mat-row
  *matRowDef="let row; columns: displayedColumns"
  (click)="clickedRows.add(row)"
  [class.highlightTableColor]="clickedRows.has(row)"
></tr>

clickedRows = new Set<model>();

or remove the return statement from the highlight method

highlight(row: { ID: number }) {
  if (!this.editing) this.selectedID = row.ID;
}

Upvotes: 1

Related Questions