mui-x
mui-x copied to clipboard
[DateRangePicker] Support month and year edition on the range pickers
Correct me if I miss out anything. While using DateRangePicker on v5, I am unable to do a quick selection to change year / month. Have to manually click on the < or > button. Understand that the range design with the intend of selecting recent dates but I do have use case that requires users to select date from years ago.
- [X] I have searched the issues of this repository and believe that this is not a duplicate.
Summary 💡
Allow selection of year or month upon clicking the month / year.
Examples 🌈
- https://material.angular.io/components/datepicker/overview
Motivation 🔦
@jinqiangg if the select is from years ago, isn't it better to use two DatePicker
components?
Do you have maybe examples of how it is implemented in other date range picker components?
Same pain point as in https://github.com/mui-org/material-ui-pickers/issues/1769. I don't what what we should do, let's leave it to X.
It would be maybe also nice to have a MonthRangePicker and YearRangePicker for the time being I will use tow DatePickers with month/year views
It would be maybe also nice to have a MonthRangePicker and YearRangePicker for the time being I will use tow DatePickers with month/year views
@socramm9 Is this #4995 what you are referring to?
@socramm9 Is this #4995 what you are referring to?
Yes I build something similar myself now. It is not perfect and has some other issues but here some Images for Inspiration
@socramm9 Is this #4995 what you are referring to?
Yes I build something similar myself now. It is not perfect and has some other issues but here some Images for Inspiration
![]()
![]()
Do you by any chance have any example on how you achieved this?
@vazkir Yes it not up to MUI standards but its usable. Fell free to modify it however you want
https://codesandbox.io/s/busy-babycat-96jksl
@vazkir, You're my hero ... pulled it down, turned it into a component, can’t stop smiling.
Thanks SO much for posting your solution!
Whoops. Wrong attribution, original code by socramm9... sorry bout that @socramm9
Particularly need this for analytics/statistics application...
https://material.angular.io/components/datepicker/overview
does handle this also pretty well, might be something for inspiration