Primeng: Turbo table - cannot expand row by clicking on it

[tigrenok00]

Hi,

In previous table I could expand the row using (onRowClick)="dtOrderDetails.toggleRow($event.data)" , however, this does not seem to work on p-table, only expansion with the expander icon.
Am I missing something?

Thank you

Angular version: 5
PrimeNG version: 5.2.0

[bossqone]

EDIT: I've just checked documentation for row expansion and here's my suggestion:

<ng-template pTemplate="body" let-rowData let-expanded="expanded" let-columns="columns">
    <tr [pRowToggler]="rowData"> <----- add [pRowToggler] to row (and you can keep it as expander icon as well)
        <td>
            <a href="#" [pRowToggler]="rowData">
                <i [ngClass]="expanded ? 'fa fa-fw fa-chevron-circle-down' : 'fa fa-fw fa-chevron-circle-right'"></i>
            </a>
        </td>
        <td *ngFor="let col of columns">
            {{rowData[col.field]}}
        </td>
    </tr>
</ng-template>

---

ORIGINAL: Turbo Table is more template oriented, so basically you can bind click event directly on your row. For example:

<p-table [columns]="cols" [value]="cars" [paginator]="true" [rows]="10">
    <ng-template pTemplate="header" let-columns>
        <tr>
            <th *ngFor="let col of columns">
                {{col.header}}
            </th>
        </tr>
    </ng-template>
    <ng-template pTemplate="body" let-rowData let-columns="columns">
        <tr (click)="onRowClick(rowData)"> <------ here you can attach click event listener
            <td *ngFor="let col of columns">
                {{rowData[col.field]}}
            </td>
        </tr>
    </ng-template>
</p-table>

or you can try to use onRowSelect event on table (but I haven't tested it yet and from my point of view it has different meaning).

[tigrenok00]

@bossqone Wow, the pRowToggler solution is really elegant and works perfectly. Thank you very much!

[michaelhalbig]

Hi, the new template solution is great - but I cannot expand a single row. I set rowExpandMode to single - but it still expands all rows. Also I do not understand why the dataKey needs to be set if I use row expansion? Are you storing all keys of the selection in a list? (I dont have a uniqe key for my records)

[pratiksa]

Hi,I am facing same issue. It is expanding all the rows.

Below are my version details-
PrimeNG-5.2.5
Theme-Omega

Can anyone tell,why this is happening and also what is the exact use of dataKey?

[michaelhalbig]

I looked at the code - the field dataKey is stored in an hash expendedRowKeys which is used to determine the expanded row. If you have no unique key then all rows will be expanded where the dataKey field matches they dataKey field from the row you want to expand. First question - why is a dataKey field used and not simple the index of the expanded row stored in the hash? Or at least for single expansion mode dataKey field should be unnecessary and a separated variable should hold the index of the expanded row. I have not tried it - but even I create my own unique key (numbering all rows in one field for example) this will most likely not work as soon as I delete or add rows to my table.