Our blazing fast Grid component built with pure JavaScript


Post by henrikbackman »

Hi,

When I try to sort a list of Swedish characters and a mixture of uppercase and lowercase characters the sorting does all kinds of strange things. Is there something that can be done about this? Please take a look at the attached image.

Thanks.
Attachments
sort.png
sort.png (72.73 KiB) Viewed 3519 times

Post by mats »

Could you please provide us your input dataset so we can try to reproduce this?

Post by henrikbackman »

[
  'Andersson',
  'testsson',
  'Åhman',
  'Svensson',
  'Ängman',
  'sofi',
  'Östra',
  'Wanger',
]

Post by henrikbackman »

And it doesn't seem to work when sorting numbers either, even if I use "type: 'number'" as in your example on https://www.bryntum.com/docs/grid/#Grid/feature/Sort

Post by pmiklashevich »

I've tried your data on the sample https://bryntum.com/examples/grid/sorting/
the asc sort order is: A..Za..zÅÄåäÖö. Numbers get sorted as usual numbers.
Values get compared using "<" and ">" operators.
You can also provide your custom sorting function to colums, for example:
{
    text     : 'City',
    field    : 'city',
    flex     : 1,
    sortable : (a, b) => a['city'].localeCompare(b['city'], 'sv', {caseFirst : 'upper'})
},
Please check localeCompare docs for details
https://developer.mozilla.org/en-US/doc ... aleCompare

Pavlo Miklashevych
Sr. Frontend Developer


Post by henrikbackman »

What do you mean? Is it sorted like: A, b, C, d, Z, å, Ä, ö when you use my array? Or is it A, C, Z, Ä, b, d, å, ö? (I want the first version)

When I sort on type: number it will sort 1, 10, 11, 12, 2, 3, 4, 5... not as I would assume: 1, 2, 3, 4, 5, 10, 11, 12. How is it displayed on your end and what is the intended behaviour?

Post by mats »

Sorting on Number seems fine to me, try sorting Age column here? https://bryntum.com/examples/grid/sorting/

Post by henrikbackman »

Yes but you don't have any single digit numbers there. And that is the issue.

Post by Animal »

For local column sorting, you can supply a comparator function for a column.

So:
columns: [{
    field: 'swedishName',
    text: 'Swedish name`,
    sortable: (lhs, rhs) {
        return lhs.swedishName.localeCompare(rhs.swedishName, 'sv-SE', { numeric : true });
    }
}...

Post by mats »

Yes but you don't have any single digit numbers there. And that is the issue.
I did try with single - just edit the data and try it :)

Post Reply