Ngx-datatable: Table page not updated after filtering.

[xhagrg]

I went through and implemented it for myself, the filtering using the example. It seems that the page is not reset when filtering.
Steps to reproduce:

1. Go to any page other than the first page.
2. Filter using any name from the first page.
3. Total records found shows correct count, but no rows are shown.

I might be missing something. Can we reset the page back to 1 after filtering?

[amcdnl]

Please create a demo use case.

[xhagrg]

@amcdnl , the examples/demos provided on the website i.e. https://plnkr.co/edit/bvA2gMHyxFtCFN8ZWbi0?p=info contains the bug.

1. First page contains the name Valarie
   
   
2. Navigate to page 2.
   
3. Search for Valarie
   
   The total count at the bottom says it found the record, but there is no records displayed.

[xhagrg]

@amcdnl anything on this?

[Anuovec]

What is the status on this?

The problem is that it preserves the page you are on. In other words, if you are on page number 5, after filtering you are still on page 5, even though there might be less than 5 pages.

[striff]

I have the exact same issue. Please help us fix this.

[vijayanandkannan]

I have exactly the same issue. Can you please let us know how to reset to the first page

[Rezi]

Same issue. This should be prioritised, as it is a major bug.

[web265p3]

Is anybody working on that? Its a very important feature and I wont use the table if this cannot be fixed... :(

[elvisbegovic]

I have same problem with updating row event dispatchEvent resize don't works !

[amcdnl]

@istiti - i believe i fixed this, can u verify?

[xhagrg]

@amcdnl It seems the issue still persists, see the following screenshot:

[web265p3]

For me its not fixed neither...

[rajeshvaya]

is this issue fixed?

[yadejo]

The datatable component has an @Input() offset and an @Output() page. You can use these to keep track of the pagination and reset the page when the data changes.

Just set the offset to zero after filtering the dataset

[xhagrg]

Looks like @yadejo 's approach will work. Closing the issue now.

[allenan]

@yadejo do you have an example of how to access and set the data table's offset?

[rajeshvaya]

@allenan
This way works for me:

<swui-datatable
        class="material" 
        [rows]="rows"
        [columns]="columns"
        [limit]="5"
        [offset]="currentPage"
        (page)="onChange($event)"
    >

export class MyComponent {
   // your component declaration code to define rows and columns with data

    currentPage: number = 0; // set the current page to one (the value is page - 1)

    // when a page is changed by the user, below even is triggered and since there is no 3 way binding, the currentPage var needs to be set to the new value
    onChange(event: any): void {
        this.currentPage = event.offset;
    }
}

[nhducseuit]

Setting offset to 0 doesn't make the table scroll to top. the offsetY is not 0 but 540 so that the scroll bar is not on top but bottom.
Also DataTableBodyComponent.updateOffsetY(0) isn't able to change offsetY from 540 to 0.

What I did in order to successfully scroll to top:

if (table) {
            table.offset = 0;
            table.bodyComponent.offsetY = 0;
            table.element.getElementsByTagName('datatable-body')[0].scrollTop = 0;
        }