Material-ui-pickers: Provide original DOM event to onChange

Created on 4 Apr 2019  Â·  9Comments  Â·  Source: mui-org/material-ui-pickers

Is your feature request related to a problem? Please describe.

I want to have some kind of inline edit behavior, where the user can click on a date, which will open a popover containing an autofocused DateTextField with keyboard entry and a picker icon. Once the user has finished choosing a date, I would like to close the popover.

image

Context:

  • I can only rely on onChange for that.
  • onChange is fired when a date is selected using the picker and when the TextField is blurred.

Problem : I would like to autofocus the TextField once the popover open. But then, if the user clicks on the picker icon, the TextField loses focus and an onChange event is emitted.

Describe the solution you'd like

If I had the original DOM event as a second argument to onChange(date, ev), I would be able to discriminate between:

  • clickdown, keydown (for enter and escape) which should submit the change
  • blur which shouldn't.

Describe alternatives you've considered

  • Only allow keyboard entry? Not ideal.
  • Do not autofocus? Not ideal either, and the behavior will happen anyway if the user focuses the textfield before clicking on the picker icon.

Most helpful comment

+1 for always providing the event as the first argument to any user facing event prop handler.

All 9 comments

Similar to #948 by the way. Will this be solved by #862?

Duplicate of #919 and a lot of other issue. We cannot provide original dom event

Why is not possible? It's by design? Or technically impossible?

Date can be submitted from several places. Click button. Enter keydown. Blur focus.

Yes indeed. But why can't the original event be also provided to onChange, on top of the value?

onChange(value, event)

No we can’t :)
This will be not obvious.

I’m sorry, not obvious?

On Sat 13 Apr 2019 at 16:59, Dmitriy Kovalenko notifications@github.com
wrote:

No we can’t :)
This will be not obvious.

—
You are receiving this because you authored the thread.
Reply to this email directly, view it on GitHub
https://github.com/dmtrKovalenko/material-ui-pickers/issues/974#issuecomment-482816810,
or mute the thread
https://github.com/notifications/unsubscribe-auth/AAHWtYet0VbZiIZ-nwcrw0AaLiZQp9TAks5vgfDOgaJpZM4ccDJQ
.

What's not obvious is where the date came from. Without the event a complex app doesn't have the originating "event.target" and therefore cannot determine the originating control with "event.target.name". All we get is a "date". From which control? I have multiple modules with dozens of controls that send changes up to a parent. This is the only control that doesn't forward the event on an onChange. The "event.target.value" should contain the "date".

+1 for always providing the event as the first argument to any user facing event prop handler.

Was this page helpful?
0 / 5 - 0 ratings

Related issues

Harasz picture Harasz  Â·  3Comments

danmce picture danmce  Â·  3Comments

danmce picture danmce  Â·  3Comments

harvitronix picture harvitronix  Â·  3Comments

aditya81070 picture aditya81070  Â·  3Comments