Lazyload in p-datatable sort does not work

[ben1967]

Hi,

I am using the sort option in my p-dataTable. When I use lazyloading then I can't sort on the columns by clicking on the column header.
If I switch off lazy loading params then I can sort on columns but I can not load data on alle pagina's because lazyloading is off.

what I am doing wrong ?

This is my header of the p-Datatable and one p-column:

Code: Select all

<p-dataTable [value]="logs" resizableColumns="true" scrollable="true" scrollHeight="400px" selectionMode="single" [(selection)]="selectedLog"
        [contextMenu]="cm" (onRowDblclick)="onRowSelect($event)" [rows]="10" [paginator]="true" [pageLinks]="4" [responsive]="true" 
        (onSort)="changeSort($event)" [sortOrder]="sortO" [sortField]="sortF"
        [totalRecords]="totalRecords" (onLazyLoad)="loadLogsLazy($event)" [lazy]="true" [rowsPerPageOptions]="[50,100,150]">
        
        <p-header>Logging van de Integratie database</p-header>
        
        <p-column field="identifier" header="Identifier" [sortable]="true" [style]="{'width':'80px'}"></p-column>
        ..... repeat for 15 columns
</p-dataTable>

This is my typescript event for sorting and lazy loading:

Code: Select all

  changeSort(event) {
    if (!event.order) {
      this.sortF = 'identifier';
    } else {
      
      this.sortF = event.field;
      console.log(event.field);
    }
    
    loadLogsLazy(event: LazyLoadEvent) {
   
    setTimeout(() => {
        if(this.datasource) {
          console.log(event.rows, this.totalRecords);
            this.logs = this.datasource.slice(event.first, (event.first + event.rows));
        }
    }, 250);
  }

Thanks.

[ben1967]

Thanks, I have solved it myself, forget about this ticket.

[SproutsFM_JP]

Thanks, I have solved it myself, forget about this ticket.

People who ask for help, then solve it themselves and DON'T POST THE SOLUTION should NEVER NEVER NEVER be helped again.

[ben1967]

Thats not such a friendly remark:
Sorry, I didn't post the solution because it does not work, I simply disabled the lazy load because the table we approach wasn't that big.
So there wasn't a real solution. We stoppped with the Angular project for some time.