-
-
Notifications
You must be signed in to change notification settings - Fork 1.7k
Description
Steps to reproduce
Steps:
- Open this link to live example: https://codesandbox.io/p/sandbox/upbeat-pasteur-8vfjyw
- Enter a date via the input field
- Open the console and notice that dates are being accepted before completely entering the last date p
art
Current behavior
onAccept
is fired as soon as the user start filling in the last date part.
Date accepted 2026-10-02T08:01:00.000Z
Date accepted 2026-10-02T08:12:00.000Z
I want to enter 2026-10-02 08:12
but the date is accepted as soon as I entered the first minutes digit. This contrast with the picker alternative where I actually need to click ok
before onAccept
is fired.
Expected behavior
I expect onAccept
to always behave similarly to the picker. Ideally it should only fire after the user gives the go.
Context
My use case is to make a request after the user has selected a date. The date field is part of a "dialog" that closes after the user picked a date. Since onAccept
is fired before the completion of the entire field, my approach is now a mess of a UX.
In v6 (version I'm upgrading from), I'd just use onBlur
on the textfield. I don't think this approach works now.
From a developer perspective, the current behavior is a bit ambiguous as it doesn't wait for a clear signal from the user, which the picker does. If I want to make this work, I'd need to detect onAccept
from the picker and onAccept
from the imput field. In the second case I'd also need to somehow decide if the user is still typing...
Solutions have been discussed in #8375. I've hesitated commenting there instead of opening a new issue but #8375 can be considered completed
?
Your environment
npx @mui/envinfo
Don't forget to mention which browser you used.
Output from `npx @mui/envinfo` goes here.
Search keywords: onAcccept