Primeng How get rowIndex of row expanded?

Question

 <p-dataTable [value]="services" [paginator]="true" expandableRows="true" rowExpandMode="single">
...</p-dataTable>

exists some like this

<ng-template let-col let-period="rowData" let-ri="rowIndex"   pTemplate="body">...</ng-template>

for DataTable

Aravind · Answer 1 · 2017-05-04T19:28:31.660

15

In your ng-template for the expansion of row use the below code

<ng-template let-i="rowIndex">

   <button (click)="expand(i)"> expand </button>
</ng-template>

In the button that is clicked during expansion use the below code to get the rowindex

expand(i){
    //... your logic to expand the row...
    this.expandedRowIndex = i;
}

 <p-dataTable [value]="services" [paginator]="true" expandableRows="true" rowExpandMode="single" (onRowExpand)="onRowExpand($event)">

Update 1: As you are clicking the entire row to be expanded. You can use the onRowExpand property of the <p-datatable> to achieve this.

onRowExpand(cc){
    console.log(cc)
    //logs the entire object which is clicked     
  }

This method is triggered when the row is expanded

LIVE DEMO

edited May 04 '17 at 19:28

answered May 04 '17 at 18:20

Aravind

38,787
15
88
108

is this only way? – alehn96 May 04 '17 at 18:48
where put this inside – alehn96 May 04 '17 at 18:57
can you create a plnker?. how are you expanding a particular row? – Aravind May 04 '17 at 18:58
I have a column and in tag define that it es expandable, this mechanism work fine, but I dont get the index of row expanded – alehn96 May 04 '17 at 19:02
**WHEN is the ROW EXPANDED**?? on click of something? – Aravind May 04 '17 at 19:06
**WHEN click in row with attribute expander**, that primeng works in feature expanded dataTable – alehn96 May 04 '17 at 19:10
on click of the complete row? – Aravind May 04 '17 at 19:11
not, only in the column expander, https://www.primefaces.org/primeng/#/datatable/rowexpansion – alehn96 May 04 '17 at 19:15
In event.data is the object of row, but that id not is the index of row, you can put in id:150 and you will see thar print 150 and the row is one. If {"id":1,"vin":"consequat metus sapien ut nunc ve ...."} id is 100 so print 100 not 1. I want index of row expanded – alehn96 May 04 '17 at 19:36
in that case you can find by comparing the id with the tableData object and get index using `findIndex` function. Can't you? – Aravind May 04 '17 at 19:38
what id? how you can get id of dataTable, you only have id of object – alehn96 May 04 '17 at 19:46
`tableData object` only I meant see up. Also are you in a intention to argue or fix your issue – Aravind May 04 '17 at 19:49
Where is this documented? – nicolas.leblanc Aug 28 '17 at 19:45
didn't want to start a new question, but how do I keep the absolute row index after sorting / filtering and not the table row index? – Loveen Dyall Aug 06 '18 at 13:01

score 8 · Answer 2 · answered Feb 15 '18 at 14:21

8

<ng-template let-i="rowIndex" let-line pTemplate="rowexpansion">

rowIndex is probably added to rowExpansion now, works for me in latest version

answered Feb 15 '18 at 14:21

sabithpocker

14,744
1
38
71

This does the job. Excellent – Aruna Oct 02 '18 at 06:43
may i know what rowIndex here please ? is that a existing variable ? – jaibalaji Oct 07 '20 at 07:51
1

@jaibalaji Check this answer: https://stackoverflow.com/questions/42978082/what-is-let-in-angular-2-templates – sabithpocker Feb 01 '21 at 10:45

score 8 · Answer 3 · answered Jan 23 '19 at 10:59

8

You can use it:

<ng-template pTemplate="body" let-record="$implicit" let-rowIndex="rowIndex">
                        <tr [pSelectableRow]="record">
                            <td>
                                {{rowIndex + 1}}

answered Jan 23 '19 at 10:59

Abdus Salam Azad

4,110
40
28

Primeng How get rowIndex of row expanded?

3 Answers3