Comments (8)
@MBilalShafi Just in order to understand the situation a wee bit better - why would the grid would need to retain the previous sort, if stable sorting is all about retaining the data across the sorting operations - not any sorting state?
Anyway, I am not personally that picky on whether it is done technically as stable sort (it just happens to be what I have done everywhere else), as long as the interaction model would not require users to learn keyboard modifiers. Our user group varies from technical experts to absolute tech illiterates, and I doubt the latter even knows which keyboard modifier to use. :)
I remember there was at some point a possilibility to sort ASC/DESC/OFF. I wonder if we could figure out a mouse operated model with these, e.g. if I first sort by one column, and then sort by another column (without clicking a modifier key), effectively still retaining the first column - at least until it is explicitly turned off?
from mui-x.
@MBilalShafi Thanks for your information. As a happy user of Pro version, I am glad to see this one realised one day.
from mui-x.
As far as I understand, instead of going with the primary
and secondary
only, we chose to allow the users to provide as many criteria as possible, the criteria selected first take higher priority, so in your example, if Created On
is sorted first, and then Rating
is sorted, the first preference will be given to the Created On
which is also illustrated by the numbers assigned to each of the sort.
Now because the created on
is never repeated, you can see no visual impact on the rating, as it's now a lower priority sort.
Instead, if you try selecting Rating
first, and then Created on
, you can see the rows first sorted by rating and then by created date:
Is your proposal to inverse this behavior, i.e. the item sorted on the last taking higher priority? Don't you think it makes more sense to keep it like the current behavior (the users can always swap the order of selection of sorts)?
from mui-x.
@MBilalShafi Let me be clear on what I suggest with the same pictures you have mentioned using good old MS Excel that might be the most widely used "grid editor".
Plese note that this does not require any special data structures - it only requires that the sorted elements are retained in state, and that when the order is changed, the elements in the state are reordered. Unfortunately I do not know enough of MUI internals that I could point to where the problem might be. But as it fails in your example page, I believe the problem might be specific to the UI component (as mentioned before JavaScript Array.sort is at least claimed to be stable).
- Initially these people are ordered by name (not relevant in this example)
![Screenshot 2023-11-02 at 8 12 51](https://private-user-images.githubusercontent.com/1669965/279884317-fed7504e-5432-4fb3-9d99-cf61128d91bc.png?jwt=eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJpc3MiOiJnaXRodWIuY29tIiwiYXVkIjoicmF3LmdpdGh1YnVzZXJjb250ZW50LmNvbSIsImtleSI6ImtleTUiLCJleHAiOjE3MTQwNDk5MDQsIm5iZiI6MTcxNDA0OTYwNCwicGF0aCI6Ii8xNjY5OTY1LzI3OTg4NDMxNy1mZWQ3NTA0ZS01NDMyLTRmYjMtOWQ5OS1jZjYxMTI4ZDkxYmMucG5nP1gtQW16LUFsZ29yaXRobT1BV1M0LUhNQUMtU0hBMjU2JlgtQW16LUNyZWRlbnRpYWw9QUtJQVZDT0RZTFNBNTNQUUs0WkElMkYyMDI0MDQyNSUyRnVzLWVhc3QtMSUyRnMzJTJGYXdzNF9yZXF1ZXN0JlgtQW16LURhdGU9MjAyNDA0MjVUMTI1MzI0WiZYLUFtei1FeHBpcmVzPTMwMCZYLUFtei1TaWduYXR1cmU9NjEzNTcwZjc0OTE3MDkzYzVjMGI2ZGM5YjE0ZWEzZTM5MDFlOGRjOTRlYzZhMzMwZjY5ZDFiYjczODdlMGZiZiZYLUFtei1TaWduZWRIZWFkZXJzPWhvc3QmYWN0b3JfaWQ9MCZrZXlfaWQ9MCZyZXBvX2lkPTAifQ.dD3choAD90PgcaB7XuAm8n8xtgrJyeM7zuRL5iLkgp0)
- When selecting Sort By "Created on" (desc), the items get ordered from most recent to newest.
![Screenshot 2023-11-02 at 8 13 08](https://private-user-images.githubusercontent.com/1669965/279886521-af30152d-0dc4-4836-820a-ffe52e372621.png?jwt=eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJpc3MiOiJnaXRodWIuY29tIiwiYXVkIjoicmF3LmdpdGh1YnVzZXJjb250ZW50LmNvbSIsImtleSI6ImtleTUiLCJleHAiOjE3MTQwNDk5MDQsIm5iZiI6MTcxNDA0OTYwNCwicGF0aCI6Ii8xNjY5OTY1LzI3OTg4NjUyMS1hZjMwMTUyZC0wZGM0LTQ4MzYtODIwYS1mZmU1MmUzNzI2MjEucG5nP1gtQW16LUFsZ29yaXRobT1BV1M0LUhNQUMtU0hBMjU2JlgtQW16LUNyZWRlbnRpYWw9QUtJQVZDT0RZTFNBNTNQUUs0WkElMkYyMDI0MDQyNSUyRnVzLWVhc3QtMSUyRnMzJTJGYXdzNF9yZXF1ZXN0JlgtQW16LURhdGU9MjAyNDA0MjVUMTI1MzI0WiZYLUFtei1FeHBpcmVzPTMwMCZYLUFtei1TaWduYXR1cmU9Y2Q5ZTMwYWE3ZjU5MjM5NDAwMWY0ZDY3NzI0YmE2N2I0ZTUxZmFhM2ZlZmNjNmU3MGNhOGViM2UyMWQ5NWJmMSZYLUFtei1TaWduZWRIZWFkZXJzPWhvc3QmYWN0b3JfaWQ9MCZrZXlfaWQ9MCZyZXBvX2lkPTAifQ.p3AFSzVd5ekL9NIIJjYDNgoPkvs0txXTbRfVDcf019g)
![Screenshot 2023-11-02 at 8 13 19](https://private-user-images.githubusercontent.com/1669965/279886536-552a3a56-227b-4d83-9df1-10c545135e54.png?jwt=eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJpc3MiOiJnaXRodWIuY29tIiwiYXVkIjoicmF3LmdpdGh1YnVzZXJjb250ZW50LmNvbSIsImtleSI6ImtleTUiLCJleHAiOjE3MTQwNDk5MDQsIm5iZiI6MTcxNDA0OTYwNCwicGF0aCI6Ii8xNjY5OTY1LzI3OTg4NjUzNi01NTJhM2E1Ni0yMjdiLTRkODMtOWRmMS0xMGM1NDUxMzVlNTQucG5nP1gtQW16LUFsZ29yaXRobT1BV1M0LUhNQUMtU0hBMjU2JlgtQW16LUNyZWRlbnRpYWw9QUtJQVZDT0RZTFNBNTNQUUs0WkElMkYyMDI0MDQyNSUyRnVzLWVhc3QtMSUyRnMzJTJGYXdzNF9yZXF1ZXN0JlgtQW16LURhdGU9MjAyNDA0MjVUMTI1MzI0WiZYLUFtei1FeHBpcmVzPTMwMCZYLUFtei1TaWduYXR1cmU9MTJmMjhiYjZiM2JlNzU0MzBkNjc4OWUxYjNkOTY4NWYwNGE2ZjQzYWE0MGYzNDlmODlkYmY2MzI2M2UyNTM5ZCZYLUFtei1TaWduZWRIZWFkZXJzPWhvc3QmYWN0b3JfaWQ9MCZrZXlfaWQ9MCZyZXBvX2lkPTAifQ.M65gadwP7LF9lPBCku8jlwkNyvHYhu9emJuD6ZG9ggM)
- When selecting Sort By "Rating", the items get ordered by rating.
Current & expected outcome: *Please pay close attention to "Created on" - they remain ordered by date within the rating groups (the most recent 5-start item appears first, e.g. 24.10. appears before 12.10.). This is not a coincidence, but stable sorting.
Now, when repeating the same pattern with the MUI Grid example:
- The initial order is whatever it might be (in this case Name DESC)
![Screenshot 2023-11-02 at 8 14 42](https://private-user-images.githubusercontent.com/1669965/279898646-59c63390-0bad-47d5-bf7a-818162698bb4.png?jwt=eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJpc3MiOiJnaXRodWIuY29tIiwiYXVkIjoicmF3LmdpdGh1YnVzZXJjb250ZW50LmNvbSIsImtleSI6ImtleTUiLCJleHAiOjE3MTQwNDk5MDQsIm5iZiI6MTcxNDA0OTYwNCwicGF0aCI6Ii8xNjY5OTY1LzI3OTg5ODY0Ni01OWM2MzM5MC0wYmFkLTQ3ZDUtYmY3YS04MTgxNjI2OThiYjQucG5nP1gtQW16LUFsZ29yaXRobT1BV1M0LUhNQUMtU0hBMjU2JlgtQW16LUNyZWRlbnRpYWw9QUtJQVZDT0RZTFNBNTNQUUs0WkElMkYyMDI0MDQyNSUyRnVzLWVhc3QtMSUyRnMzJTJGYXdzNF9yZXF1ZXN0JlgtQW16LURhdGU9MjAyNDA0MjVUMTI1MzI0WiZYLUFtei1FeHBpcmVzPTMwMCZYLUFtei1TaWduYXR1cmU9Zjg4YjMyNTFjYmY4ZGI4Y2ExZmZiMTBhZmUyM2Q2ZDRkZDBhYTllZTI3YjFiYzA0ZTk1MmNjNGY1MWExMmE5NyZYLUFtei1TaWduZWRIZWFkZXJzPWhvc3QmYWN0b3JfaWQ9MCZrZXlfaWQ9MCZyZXBvX2lkPTAifQ.YMCETdCmJGXcOeNzh9teEXriYJ4eUPDDQbIqT-ssXbg)
- I sort by "Created on" DESC
![Screenshot 2023-11-02 at 8 19 03](https://private-user-images.githubusercontent.com/1669965/279897623-0a32364c-ac0f-4d09-8cd5-2964ed0f28f7.png?jwt=eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJpc3MiOiJnaXRodWIuY29tIiwiYXVkIjoicmF3LmdpdGh1YnVzZXJjb250ZW50LmNvbSIsImtleSI6ImtleTUiLCJleHAiOjE3MTQwNDk5MDQsIm5iZiI6MTcxNDA0OTYwNCwicGF0aCI6Ii8xNjY5OTY1LzI3OTg5NzYyMy0wYTMyMzY0Yy1hYzBmLTRkMDktOGNkNS0yOTY0ZWQwZjI4ZjcucG5nP1gtQW16LUFsZ29yaXRobT1BV1M0LUhNQUMtU0hBMjU2JlgtQW16LUNyZWRlbnRpYWw9QUtJQVZDT0RZTFNBNTNQUUs0WkElMkYyMDI0MDQyNSUyRnVzLWVhc3QtMSUyRnMzJTJGYXdzNF9yZXF1ZXN0JlgtQW16LURhdGU9MjAyNDA0MjVUMTI1MzI0WiZYLUFtei1FeHBpcmVzPTMwMCZYLUFtei1TaWduYXR1cmU9YTYyYjY1MTUzZGY5ZTAxMDBiNDkyYmRkNzlkYTYwYzA1NzdiMTU5OGE2ODk4NWI0NmFjMzUwODIwNDNmZjM1MSZYLUFtei1TaWduZWRIZWFkZXJzPWhvc3QmYWN0b3JfaWQ9MCZrZXlfaWQ9MCZyZXBvX2lkPTAifQ.k1xHQJBR3KJjFbxDZ3bT5OgEI3IvnmudiPap9YVeP8g)
- I Sort by "Rating" DESC
![Screenshot 2023-11-02 at 8 15 29](https://private-user-images.githubusercontent.com/1669965/279897868-7b35e534-1057-49f9-8659-4d2ce89c46b7.png?jwt=eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJpc3MiOiJnaXRodWIuY29tIiwiYXVkIjoicmF3LmdpdGh1YnVzZXJjb250ZW50LmNvbSIsImtleSI6ImtleTUiLCJleHAiOjE3MTQwNDk5MDQsIm5iZiI6MTcxNDA0OTYwNCwicGF0aCI6Ii8xNjY5OTY1LzI3OTg5Nzg2OC03YjM1ZTUzNC0xMDU3LTQ5ZjktODY1OS00ZDJjZTg5YzQ2YjcucG5nP1gtQW16LUFsZ29yaXRobT1BV1M0LUhNQUMtU0hBMjU2JlgtQW16LUNyZWRlbnRpYWw9QUtJQVZDT0RZTFNBNTNQUUs0WkElMkYyMDI0MDQyNSUyRnVzLWVhc3QtMSUyRnMzJTJGYXdzNF9yZXF1ZXN0JlgtQW16LURhdGU9MjAyNDA0MjVUMTI1MzI0WiZYLUFtei1FeHBpcmVzPTMwMCZYLUFtei1TaWduYXR1cmU9MDg1YzdkNThhMTZhYTFmMDUyNTZmOThiZTQ3OTVmZDE4OWViMDNmOGE3ZmJmZGE3MTIwNjY5YWU0ZjBjN2Q5MyZYLUFtei1TaWduZWRIZWFkZXJzPWhvc3QmYWN0b3JfaWQ9MCZrZXlfaWQ9MCZyZXBvX2lkPTAifQ.JgEZlM2jht7P5hlMSdIFG_WWhpbcM3XXz36lPxXvFMw)
When scrolling down, I see':
![Screenshot 2023-11-02 at 8 19 21](https://private-user-images.githubusercontent.com/1669965/279897414-4d8897de-4074-46f1-8f24-de9daadb6420.png?jwt=eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJpc3MiOiJnaXRodWIuY29tIiwiYXVkIjoicmF3LmdpdGh1YnVzZXJjb250ZW50LmNvbSIsImtleSI6ImtleTUiLCJleHAiOjE3MTQwNDk5MDQsIm5iZiI6MTcxNDA0OTYwNCwicGF0aCI6Ii8xNjY5OTY1LzI3OTg5NzQxNC00ZDg4OTdkZS00MDc0LTQ2ZjEtOGYyNC1kZTlkYWFkYjY0MjAucG5nP1gtQW16LUFsZ29yaXRobT1BV1M0LUhNQUMtU0hBMjU2JlgtQW16LUNyZWRlbnRpYWw9QUtJQVZDT0RZTFNBNTNQUUs0WkElMkYyMDI0MDQyNSUyRnVzLWVhc3QtMSUyRnMzJTJGYXdzNF9yZXF1ZXN0JlgtQW16LURhdGU9MjAyNDA0MjVUMTI1MzI0WiZYLUFtei1FeHBpcmVzPTMwMCZYLUFtei1TaWduYXR1cmU9MWI2MGU0MzNlZWQ0N2MzNzU0MzQ2YmI4ODU2OWQxMzUxMjMwY2MwNTA3NzI0Mzk1YjVkNDk3NzdjYmY5MWNmMCZYLUFtei1TaWduZWRIZWFkZXJzPWhvc3QmYWN0b3JfaWQ9MCZrZXlfaWQ9MCZyZXBvX2lkPTAifQ.WHlrNuOV721rRoaLCNLQOQt4KkwBpuaFO-KjsG5u75E)
Current outcome: The previous sort order is not retained, at least fully - the order of "Created on" is messed up within the same 5-star rating groups
Expected outcome: The previous sort order would be retained
from mui-x.
@mui/xgrid Can someone help here? I don't think there is a concrete thing that we can do but rather understand the decision we took when we did the multi-sorting feature.
from mui-x.
Ah I see, thanks for the detailed example, now I understand your request.
For the grid, you can achieve the same by multiple sort criterion as I mentioned in my first comment, the grid doesn't retain the previous sort for the column from which the sort has been removed, that's a design choice we took while implementing sorting and I think it makes sense too because more freedom is available to users to define any sort priority/order using multi-sorting. (For a benchmark, AgGrid also behaves in a similar fashion)
@mui/xgrid What do you think?
from mui-x.
Would it make sense to add an option for changing the default sorting behavior to multi-sorting?
from mui-x.
why would the grid would need to retain the previous sort, if stable sorting is all about retaining the data across the sorting operations - not any sorting state
You are correct, when I mentioned "the grid doesn't retain the previous sort", technically I meant the same, the wording might be confusing. Tbh, I feel your request makes sense.
We discussed and decided to consider the stable sort as a Pro
option alongside multi-sorting. Please keep checking this issue for further updates.
from mui-x.
Related Issues (20)
- [pickers] Datepicker Onchange event is not firing at every keystroke HOT 3
- [charts] slots for PieArcLabelPlot defined in PieArcLabelPlotSlots but never passed down from PieChart HOT 4
- support date-fns 3.x HOT 3
- [data grid] Drag the rows within to another data grid or DOM element HOT 5
- [pickers] Rendering Issue with MuiDayCalendar for November 2024 to March 2025 HOT 1
- Autocomplete popupIcon icon is turning down HOT 3
- DataGrid crashes when manually inputing date for filter HOT 4
- [data grid] Delayed rows replaced with lazy loading, can't remove loading skeleton rows HOT 9
- [DesktopDatePicker] this component don't handle the summer time change CET/CEST HOT 1
- npm package of @mui/x-data-grid: version 7.2 is not the current version HOT 2
- [pickers][DateTimePicker] Duplicate hour 03 instead of 02 HOT 2
- [data grid] Column Resize Issue when we've controlled selection HOT 3
- [data grid] Column Grouping not working HOT 1
- [data grid] Actions list in data grid doesn't work with dialogs HOT 3
- [DataGrid] Date in Filter changes after selection in v7 HOT 2
- [data grid] Whats the preferred way to handle edit events? HOT 4
- [data grid] Accordian in DataGrid HOT 5
- [pickers] @mui/x-date-pickers bug styles css when build webpack 5 production HOT 4
- [pickers] Can not change mont name Date Calendar HOT 4
- [data grid] `.MuiDataGrid-columnHeader:` first-of-type doesn't work in v7 HOT 12
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from mui-x.