Primeng: TurboTable p-table row order wrong in Chrome

Created on 19 Jan 2018  路  15Comments  路  Source: primefaces/primeng

There is no guarantee in receiving a response in GitHub Issue Tracker, If you'd like to secure our response, you may consider PrimeNG PRO Support where support is provided within 4 business hours

I'm submitting a ... (check one with "x")

[x] bug report => Search github for a similar issue or PR before submitting
[ ] feature request => Please check if request is not on the roadmap already https://github.com/primefaces/primeng/wiki/Roadmap
[ ] support request => Please do not submit support request here, instead see http://forum.primefaces.org/viewforum.php?f=35

Turbo table lives up to its name - it's so fast!

Current behavior
If I add 20 items to a p-table, without any sorting, the items appear in the correct order in IE or Edge, but in Chrome they are in the wrong order. Item 11 appears first, item 2 appears where item 11 should have been.

Eg in Edge: 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15, 16, 17, 18, 19, 20
Eg in Chrome: 11, 1, 3, 4, 5, 6, 7, 8, 9, 10, 2, 12, 13, 14, 15, 16, 17, 18, 19, 20

This only occurs if you have more than 10 items in the table.
The items that are misplaced are always item 2 and item (N/2+1), where N is the number of items. Eg. with 1000 items, item 501 appears first and item 2 appears between 500 and 502

You can see this behaviour in the p-table documentation examples: https://www.primefaces.org/primeng/#/table/scroll
Looking at the first table, in IE/Edge you get the correct order:

a1653d4d
ddeb9b10
d8ebe413
aab227b7
631f7412
...

In Chrome, an item from the middle of the list has been put at the top (46e4bbe8), and the second item (ddeb9b10) has been moved to the middle of the list:

46e4bbe8
a1653d4d
d8ebe413
aab227b7
631f7412
...

Expected behavior
Items in the table should be displayed in the order they are in the data source in all browsers

Minimal reproduction of the problem with instructions
Create the simplest one-column p-table without any sorting
Give it twenty items numbered 1 to 20
View in Chrome

What is the motivation / use case for changing the behavior?
Need to display items in the order as provided by the server.

Please tell us about your environment:
Angular CLI: 1.6.3
Node: 8.9.4
OS: win32 x64
Angular: 5.2.1

  • Angular version: 5.2.1

  • PrimeNG version: 5.2.0-rc.1

  • Browser: Chrome 63

  • Language: Typescript 2.4.2

  • Node (for AoT issues): Node: 8.9.4

Most helpful comment

Same here! Is there a way to disabled sorting in general? My data is already sorted.

EDIT: Found a solution, enable custom sort in p-table, but omit a custom sort function: [customSort]="true"

All 15 comments

Hi @cagataycivici. Thanks for your response, but I don't feel that the posted known issue with Chrome explains the misbehaviour of TurboTable in Chrome. The referenced article is about sorting behaviour, whereas the issue in TurboTable occurs when there is no sorting enabled. TurboTable should not be sorting the data if sorting is not requested.

Hi, I have the same problem as described in the first post. The old dataTable works fine in Chrome and Firefox but the new turboTable, using the same data source, mixes up certain rows in Chrome (version 63.0.3239.132). This is all without sorting the data.

datatable_vs_turbotable

Same problem. Works fine with the old datatable.
Please reopen.

I have the same problem, it worked before. It seems it has something to do with the first row.
tablesort

Same here! Is there a way to disabled sorting in general? My data is already sorted.

EDIT: Found a solution, enable custom sort in p-table, but omit a custom sort function: [customSort]="true"

Please reopen this used to work fine before Jan 19th merge

Workaround to this issue posted to #5050

I'm facing the same issue

easy way to fix is
add new column then set counting number and set sortField with it

alrabe's workaround works like a charm. I spent hours of debugging until i found out this is a bug with the new table.

Another workaround is putting [sortMode]="none". I think this is better because it is the default behavior

Both workarounds solve the initial sorting, but then they stop the columns sort feature from working. Any other solution for the initial sort?

@tigrenok00 There's been an update. Try downloading 5.2.4. I got it yesterday and problem solved :-)

You can solve it by putting the field dataKey = "your-field". It has worked for me without losing the sorting funcionality.

Was this page helpful?
0 / 5 - 0 ratings