1

I'm trying to sort a column that has template. My understing is that when a column uses a template, the sorting should be done by responding to the sorting event.

<p-column field="activityName" [sortable]="true" (onSort)="onNameSorting($event)">
  <ng-template let-col let-activity="rowData" pTemplate="body">
   //..
  </ng-template>
</p-column>

However, when I put a breakpoint in the event handler, nothing is happening. Am I missing something?

onNameSorting(e){
  debugger;       //--> the breakpoint is not being hit
  //...
}

Thanks for helping

Edit

The breakpoint is being hit, the sorting is being performed. Yet no change is being reflected in the dataTable.

onNameSorting(e, dt){
  debugger;              //This break point is being hit now.
  if(!!e.order && e.order > 0){
     this.filteredItems = this.filteredItems
        .sort((a, b) => (a.activityName < b.activityName) ? -1 : 1);
  }else{
     this.filteredItems = this.filteredItems
        .sort((a, b) => (a.activityName > b.activityName) ? -1 : 1);
  }
}
Richard77
  • 20,343
  • 46
  • 150
  • 252

1 Answers1

1

I am assuming you are using the old prime data-table. In that version there was no (onSort)="onNameSorting($event)" binding to the p-column. Move that to the p-dataTable

Ex:-

<p-dataTable scrollable="true" [value]="_rowList" [selectionMode]="selectionMode"
             [responsive]="true" (selectionChange)="rowSelectionChange($event)"
             (click)="rowSingleClick($event)" (dblclick)="rowDoubleClick($event)" [(selection)]="_selectedEntity"
<!-- refer to the next line, above lines are bunch of attributes -->
             (onSort)="sortData($event, dt)"[sortField]="sortField" [sortOrder]="sortOrder" #dt>
<p-column field="activityName">
  <ng-template let-col let-activity="rowData" pTemplate="body">
   //..
  </ng-template>
</p-column>
</p-dataTable>

Suggestion: They have launched the new PrimeNg Turbo table. Its much easier and faster.

ymssa___
  • 993
  • 9
  • 16
  • we're still using the old dataTable., and that's not my decision Let's hope that your solution works as I need to fix the same exact issue on so many pages. – Richard77 May 06 '19 at 19:16
  • the breakpoint and the sorting is being done in the event handler, but the `dataTable` is not reflecting the sorting. Please see the update. – Richard77 May 06 '19 at 21:13
  • never mind. I needed to add `this.filteredItems = [...this.filteredItems]` for the dataTable to detect the change. – Richard77 May 06 '19 at 21:55
  • sorry for late reply, I hope you got it to working. – ymssa___ May 07 '19 at 18:12