onChange is not called if user removes date via text input manually

[sankho]

If the user uses the text input and manually erases the date, onChange is never called to reflect this, leaving undefined / false values as possibly undetectable.

Expected Behavior

1. If the text input is manually cleared, onChange should be called with undefined values.
2. If the text input contains an invalid date, it could perhaps return an error saying so.

Current Behavior

1. If the text input is manipulated to contain an invalid date, or no date at all, the onChange event never fires.

Steps to Reproduce (for bugs)

1. attach a console statement to the onChange handler to verify it runs
2. choose a date using the date picker.
3. using the text input manually alter the date - invalid values or blank values won't trigger onChange

Context

Although there is the "x" button, users still get confused as to why clearing out the date manually doesn't work.

Your Environment

• Version used: v. 5.0.1
• Browser Name and version: Safari
• Operating System and version (desktop or mobile): mac sierra

[sankho]

just covering my bases here but sorry if I'm being dumb and just missing some obvious option. Thanks!

[p4sI]

There is the onBlur()-function which you could use to detect if the user leaves focus and then do a manual check of the value.

...
value={this.state.date}
onBlur={(e) => {
        const typedDate = new Date(e.target.dataset.formattedvalue);
        this.setState({date: typedDate})
}}
...

Don't forget to check if the new Date is invalid. Could happen if the user enteres something like "2018/01//////23425345"

[ekaitzht]

@p4sI if user clicks a button directly after fill the datepicker onBlur never is going to be trigger.