[question] DateRangePicker readonly only for one of the two fields

[david-ic3]

The problem in depth

There is an option to have a range date picker in a readonly mode : https://mui.com/x/react-date-pickers/date-range-picker/ . This set both start and end date in a readonly mode.

What is the best way to set the readonly mode to only the 'end' date ?

Your environment

No response

Search keywords: DateRangePicker readonly
Order ID: #19458

[LukasTy]

Hello @david-ic3
I've explored possible solutions and I do not see an easy way to do it, without overriding a bit too much code. 🙈

Could you provide more information about your use case?
Why do you need only the end date in "readonly" mode?
At first sight, it would seem like a bit of a strange UX behavior.

Maybe having the bigger picture about you need to achieve, we'd be able to come up with a different solution for it. 🤞 🤔

[david-ic3]

@LukasTy , there is goes :

It's for the end users to select a range of dates with a fixed en date. The end date is decided by the data used.

We still want to have the nice look of the Range Calendar without the possibility to change the end date.

[LukasTy]

@david-ic3 Thank you for confirming your use case. 👍
What do you think about going for a custom field implementation, where you would not pass the event listeners to the end field to avoid having the option of adjusting the value through that input?
Could such a solution be enough to cover your use case?
P.S. You could also couple it with controlling the rangePosition to enhance your desired behavior.

[github-actions]

The issue has been inactive for 7 days and has been automatically closed.