Bhrungarajni
Bhrungarajni

Reputation: 2535

How to select the particular row for delete operation using angular2

I have main checkbox and a checkbox against each of the row, If i select on main checkbox then, all the items present is getting checked, but i am not able to get the entire row for deleting in console. And what ever row i click also i must get that item in console.

HTML:

<a id="lnk_Condition" (click)="deleteConditionDetails()" style="padding-left: 15px">Delete
</a>
<p-table #dt [columns]="tableHeaders" [value]="ccdList" [lazy]="true" [paginator]="true" (onLazyLoad)="loadLazy($event)"
  [totalRecords]="totalcount" [rows]="10">
  <ng-template pTemplate="header" let-columns>
    <tr role="row">
      <th width="30">
        <input type="checkbox" [(ngModel)]="selectedAll" (change)="selectAll()" #ccdListViewChild>
      </th>
      <th width="90">Date Added
      </th>
      <th width="300">Description
      </th>
    </tr>
  </ng-template>
  <ng-template pTemplate="body" let-rowData let-columns="columns">
    <tr [pSelectableRow]="rowData">
      <td><input type="checkbox" [(ngModel)]="rowData.selected" (change)="checkIfAllSelected();"></td>
      <td>{{rowData.DateAdded}}</td>
      <td>{{rowData.Description}}</td>
    </tr>
  </ng-template>
</p-table>

TS:

selectAll() {
  for (var i = 0; i < this.ccdList.length; i++) {
    this.ccdList[i].selected = this.selectedAll;
  }
}

checkIfAllSelected() {
  this.selectedAll = this.ccdList.every(function (item: any) {
    return item.selected == true;
  })
}

deleteConditionDetails() {

}

Upvotes: 0

Views: 141

Answers (1)

maha
maha

Reputation: 643

first change the Delete to a button just to make it easier :

<button (click)="deleteConditionDetails()"> Delete </button>

and then in the function implement this:

   deleteConditionDetails() {
    let i=0;
    for(i=0;i<this.ccdList.length;i++) {
      if(this.ccdList[i].selected)
          console.log(this.ccdList[i]);
    }
 }

Upvotes: 1

Related Questions