CODEWITHSUNDEEP
htmlangularcheckbox
Liem
Liem

Reputation: 456

shouldn't uncheck checkbox in certain conditions

<input type="checkbox" [(ngModel)]="rowData.forA">  // checkbox A
<input type="checkbox" [(ngModel)]="rowData.forB">  // checkbox B
<input type="checkbox" [(ngModel)]="rowData.forC">  // checkbox C

I have these checkbox. And a model:

class Book {
  name: string;
  forA: boolean;
  forB: boolean;
  forC: boolean;
}

forA forB forC mean the book should be used in condition A, condition B or condition C.

In some conditions, if checkbox A is checked, and it's used in a kind of condition A, you cannot uncheck it. how to do that?

Upvotes: 0

Views: 46

Answers (2)

AVJT82
AVJT82

Reputation: 73337

You can use $event.preventDefault() based on your conditions. This is a sample of not allowing checkbox to be checked if rowData.forB is true:

<input type="checkbox" 
       [(ngModel)]="rowData.forA" 
       (click)="rowData.forB ? $event.preventDefault() : ''">

Upvotes: 1

JSmith
JSmith

Reputation: 4808

you could use the [readonly]attribute with a condition inside

for example if you want forA to be readonly if forB and forC are checked you could do.

<input [readonly]="rowData.forB && rowData.forC" [(ngModel)]="rowData.forA">

Now if you don't want readonlybut as told in the comment a checkbox checking automatically with condition you need to do the following

<input [checked]="rowData.forB && rowData.forC" [(ngModel)]="rowData.forA">

Upvotes: 3

Related Questions