I am trying to get multiple selected table row index in my code. But i am getting only one row index. So, How to get mutiple selected row index?
app.component.html:
<table class="table table-bordered">
<thead></thead>
<tbody>
<ng-container *ngFor="let row of data1">
<tr>
<td><input type="checkbox" [(ngModel)]="row.isSelected"/></td>
<td (click)="row.isExpand = !row.isExpand">
<i *ngIf="!row.isExpand" class="bi-chevron-right"></i>
<i *ngIf="row.isExpand" class="bi-chevron-up"></i>
{{ row.name }}
</td>
</tr>
<tr *ngIf="row.isExpand">
<td colspan="2">
{{ row.expandData }}
</td>
</tr>
</ng-container>
</tbody>
app.component.ts:
addSelectedRow() {
const selectedRowIndexFromTable1 = this.data1.findIndex(
(row) => row.isSelected
);
if (selectedRowIndexFromTable1 !== -1) {
this.data2.push({
...this.data1[selectedRowIndexFromTable1],
isSelected: false,
});
}
alert(selectedRowIndexFromTable1);
}
removeSelectedRow() {
const selectedRowIndexFromTable2 = this.data2.findIndex(
(row) => row.isSelected
);
if (selectedRowIndexFromTable2 !== -1) {
this.data2.splice(selectedRowIndexFromTable2, 1);
}
}
you need to change the addSelectedRow function, check below code and replace the function with that.
you are using findIndex method which return the index value of first match element and that is the reason it is only adding one record in data2 object
convert that code into fetching multiple records with isSelected condition using filter method and insert all the records into data2 object using loop
addSelectedRow() {
const selectedItems = this.data1.filter((row) => row.isSelected);
this.data2 = [];
selectedItems.forEach((item) => {
this.data2.push({
...item,
isSelected: false,
});
});
alert(selectedItems);
}