CODEWITHSUNDEEP
angulartypescriptprimengprimeng-turbotable
E.Meir
E.Meir

Reputation: 2226

Refresh the data and paginator state

I am using PrimeNG Turbotable <p-table #dt.

According this dt.reset() will reset sort, filter and paginator state. I am trying to find a way to reset paginator state and reload table data. (without the sort state reset)

This should happen on (click) of that button enter image description here

<p-button icon="fa fa-refresh" (click)="refresh()"></p-button>

How can I achieve that ?

Upvotes: 3

Views: 17422

Answers (5)

harsh tibrewal
harsh tibrewal

Reputation: 835

In .html file -

<p-table #dt [columns]="cols" [value]="result" [paginator]="true" [rows]="10" [(first)]="first">

Don't forget the brackets in [(first)]

In .ts file, Add first attribute : 

first = 0

wherever you want to reset, call below mentioned refresh function

refresh() {
    this.first = 0;
}

Upvotes: 7

kmacew
kmacew

Reputation: 1

i found solution, it's quite messy but it does the job. Use the @ViewChild to access your html dom: @ViewChild('dt', { static: false }) dt: any;

I saw there's a property called: sortOrder. It has two values 1 and -1. I forced to reload the sort by adding:

this.dt.sortOrder = - this.dt.sortOrder; this.dt.sortOrder = - this.dt.sortOrder;

Upvotes: 0

Anup Bangale
Anup Bangale

Reputation: 631

In your template get a reference to your p-table by using @ViewChild

<p-table #turboTable [columns]="cols" [value]="cars" [paginator]="true" [rows]="10" >
<p-button icon="fa fa-refresh" (click)="refresh()"></p-button>

In component file

    @ViewChild('turboTable', { static: false }) turboTable: any;

    refresh(){    
       this.turboTable._first = 0;
      //call your get service without filter
    }

Upvotes: 0

Ingmar Aguiar
Ingmar Aguiar

Reputation: 1

Try this:

refresh() {
    dt.first = 0;
}

Upvotes: 0

Antikhippe
Antikhippe

Reputation: 6685

Since your HTML looks like 

<p-table [columns]="cols" [value]="cars" [paginator]="true" [rows]="10" [first]="first">

where first is the index of the first row to be displayed, to reset only pagination, you should put its value to 0 :

refresh() {
    this.first = 0;
}

Then if you want to also reload your data, you just have to call your service again (if needed) in your refresh method.

Upvotes: 2

Related Questions