How to get the Id when i check a checkbox button

Viewed 69

My question is when i check a checkbox i want to take the CategoryId below ill share my data and codes that i tried. Here is my data from database

 {
      "expires_in": 0,
      "data": [
        {
          "categoryId": 11,
          "categoryName": "Hepatic",
          "hubxDataItems": [
            {
              "categoryId": 11,
              "itemTitle": "AST(GOT)",
              "itemValue": "35",
              "itemUnit": "Units/L",
              "isActive": true,
              "isDeleted": false,
              "createdDate": "2022-06-30T22:38:56.3825811",
              "createdBy": 1,
              "patientId": 40,
              "categoryName": "Hepatic"
            },

the code that i tried any changes should i make in this code.

<div class="profile-diagnos">
            <div class="panel-body" *ngIf="hubxReportList.length===0">No records found</div>
            <div class="example-headers-align">
                <div *ngFor="let hubxReport of hubxReportList; let i=index">
                <div class="lineheader  "> 
                  <section class="example-section" [formGroup]="patientReportForm">
                  <p><mat-checkbox color="primary" labelPosition="before" formControlname="hubxCategoryId" [value]="hubxReport.categoryId" 
                    (change)="onChecked(hubxReport, $event)">{{hubxReport.categoryName}}</mat-checkbox></p>
                      <!-- <p class="headerfontsize">{{hubxReport.categoryName}}</p>    -->
                    </section>
                </div>

                <div class="row paddingTop headerpaddingbottom">
                    <div *ngFor="let item of hubxReport.hubxDataItems" class="col-sm-4">
                      <mat-form-field class="example-full-width lineheight25  ">
                        <input matInput autofocus placeholder={{item.itemTitle}} [(ngModel)]="item.itemValue"
                          readonly />
                        {{item.itemUnit}}
                      </mat-form-field>
                    </div>
                </div>
                </div>
            </div>
        </div>

this is my formcontrol :

this.patientReportForm = new FormGroup({
          patientId: new FormControl(this.clientId),
          hubxCategoryId : new FormControl(),
          isTestApproved : new FormControl(),
          notes : new FormControl(),
    
        })

this is the function that i used to get the category id

onChecked(item: any, event: any){
    let {checked, value} = event;
    if(checked) {
      this.checkedItems.push(value);
    } else {
      let index = this.checkedItems.indexOf(value)
      if (index !== -1) this.checkedItems.splice(index, 1);
    }
  }
1 Answers

You can call your function while passing the id to it.

(change)="onChecked(hubxReport, $event, hubxReport.id)"

And then change your function.

onChecked(item: any, event: any, id:any){
    let {checked, value} = event;
    if(checked) {
      this.checkedItems.push(value);
    } else {
      let index = this.checkedItems.indexOf(value)
      if (index !== -1) this.checkedItems.splice(index, 1);
    }
  }
Related