CODEWITHSUNDEEP
htmlangulartypescriptvalidationangular6
Harish
Harish

Reputation: 15

How to validate multiple checkboxes in Angular 7? It should throw a message , that atleast one checkbox should be checked

 <div class="form-group">
    <div class="row mb-1">
      <div class="col">
         Select Functions from the list below:<br />
           <div class="div-table mdle_rec">
             <div *ngIf="allFunctions.length > 0" class="div-table-row">
              <div *ngFor="let fnc of allFunctions;let i = index" class="div-table-col">
              <input class="checkbox align-middle mr-1" type="checkbox" id="{{'fnc'+fnc.FunctionId}}" [checked]="fnc.IsSelected" (change)="onFuncSelectionChange(fnc.FunctionId, $event)" required>
              <span style="font-size:16px">{{fnc.Description}}</span>
             </div>
            </div>
          </div>
         </div>
        </div>
     </div>

Atleast one checkbox should be checked. If atleast one checkbox is not checked then it should throw an error.

Upvotes: 1

Views: 2620

Answers (1)

Eliseo
Eliseo

Reputation: 58019

You can use a getter function:

get someChecked()
{
   return allFunctions?allFunctions.some(x=>x.IsSelected):false
}

Use

<div *ngIf="!someChecked()">You sould check at least one</div>

Upvotes: 1

Related Questions