Skip to content

fix: CORUI-6949: add onBlur callback to DatePicker #712

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
merged 3 commits into from
Aug 13, 2019

Conversation

jbadan
Copy link
Contributor

@jbadan jbadan commented Aug 12, 2019

Description

Without doing a full rewrite at the moment, this is as close to a functional callback as we can get. Tests were a nightmare, so I decided to forgo them for this bandaid.

This behaves slightly erratically as the input is not wired up to the calendar/sharing validation.

Known bugs: Changes to the input don't necessarily update the date/trigger any event.

fixes #498

@jbadan jbadan requested a review from a team August 12, 2019 22:41
@netlify
Copy link

netlify bot commented Aug 12, 2019

Deploy preview for fundamental-react ready!

Built with commit 88c26cc

https://deploy-preview-712--fundamental-react.netlify.com

@netlify
Copy link

netlify bot commented Aug 12, 2019

Deploy preview for fundamental-react ready!

Built with commit a1ec193

https://deploy-preview-712--fundamental-react.netlify.com

@@ -303,6 +308,8 @@ class DatePicker extends Component {
<input
{...inputProps}
className={datePickerInputClasses}
onBlur={() => onBlur({ date: this.state.selectedDate,
formattedDate: this.state.formattedDate })}
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This would be better written as a separate function in the component and then referenced here like onBlur={this._handleBlur}. Otherwise, this actually creates a new instance of the function each time it goes through the render function.

};

DatePicker.propDescriptions = {
...Calendar.propDescriptions,
enableRangeSelection: 'Set to **true** to enable the selection of a date range (begin and end).'
enableRangeSelection: 'Set to **true** to enable the selection of a date range (begin and end).',
onBlur: 'Callback function for onBlur events. In the object returned, date is the date object and formattedDate is the formatted date.'
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Maybe add backticks around date and formattedDate when describing the returned object.

Copy link
Contributor

@greg-a-smith greg-a-smith left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Looks good. 🚢

@jbadan jbadan merged commit 5070d2b into master Aug 13, 2019
@jbadan jbadan deleted the fix/datepicker-callback branch August 13, 2019 17:05
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

Unable to get date from DatePicker
2 participants