treetable doesn't invoke callback method (onNodeSelect) when a node is selected and callback method (onNodeUnselect) when a node is unSelected

[rai-prashanna]

Describe the bug

If i provide [(selectionKeys)]="mySelectionKeys", treetable doesn't invoke callback method (onNodeSelect) when a node is selected and callback method (onNodeUnselect) when a node is unSelected .

example of my code snippet.

  <p-treeTable [value]="allTreeNodes" [columns]="cols"
               selectionMode="multiple"
               [(selectionKeys)]="selectionKeys"
               [(selection)]="selectedNode"
               dataKey="key"
               [scrollable]="true"
               (selectionChange)="nodeChange($event)"
               (onNodeSelect)="nodeSelect($event)"
               (onNodeUnselect)="nodeUnselect($event)"
               [tableStyle]="{'min-width':'50rem'}">
    <ng-template pTemplate="body" let-rowNode let-rowData="rowData" let-columns="columns">
      <tr>
        <td *ngFor="let col of columns; let i = index">
          <p-treeTableToggler [rowNode]="rowNode" *ngIf="i === 0"></p-treeTableToggler>
          <p-treeTableCheckbox [value]="rowNode" [disabled]="viewMode"
                               *ngIf="i === 0"></p-treeTableCheckbox>
          {{ rowData[col.field] }}
        </td>
      </tr>
    </ng-template>
  </p-treeTable>

Environment

It can be reproduce any environment.

Reproducer

No response

Angular version

17.3.4

PrimeNG version

17.17.0

Build / Runtime

Angular CLI App

Language

TypeScript

Node version (for AoT issues node --version)

18.19.0

Browser(s)

edge, chrome

Steps to reproduce the behavior

treetable doesn't invoke callback method (onNodeSelect) when a node is selected and callback method (onNodeUnselect) when a node is unSelected when i provide [(selectionKeys)]="mySelectionKeys".

example of my code snippet.

  <p-treeTable [value]="allTreeNodes" [columns]="cols"
               selectionMode="multiple"
               [(selectionKeys)]="selectionKeys"
               [(selection)]="selectedNode"
               dataKey="key"
               [scrollable]="true"
               (selectionChange)="nodeChange($event)"
               (onNodeSelect)="nodeSelect($event)"
               (onNodeUnselect)="nodeUnselect($event)"
               [tableStyle]="{'min-width':'50rem'}">
    <ng-template pTemplate="body" let-rowNode let-rowData="rowData" let-columns="columns">
      <tr>
        <td *ngFor="let col of columns; let i = index">
          <p-treeTableToggler [rowNode]="rowNode" *ngIf="i === 0"></p-treeTableToggler>
          <p-treeTableCheckbox [value]="rowNode" [disabled]="viewMode"
                               *ngIf="i === 0"></p-treeTableCheckbox>
          {{ rowData[col.field] }}
        </td>
      </tr>
    </ng-template>
  </p-treeTable>

Expected behavior

callback method (onNodeSelect) should be invoked

[mehmetcetin01140]

Hi,

Could you please share a stackblitz example so we can identify the issue clearly?

[awdorrin]

I just ran into this same problem, you need to modify the entry in the body template in order to make the row selectable..

    <ng-template pTemplate="body" let-rowNode let-rowData="rowData" let-columns="columns">
      <tr [ttRow]="rowNode" [ttSelectableRow]="rowNode">

After that, selectionChange, onNodeSelect and onNodeUnselect will work