Skip to content
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

Add component 'date picker' #89

Open
JamesDPC opened this issue Mar 13, 2024 · 5 comments
Open

Add component 'date picker' #89

JamesDPC opened this issue Mar 13, 2024 · 5 comments
Assignees
Labels
parked Item is parked until further information/changes are available

Comments

@JamesDPC
Copy link
Contributor

This seems to duplicate widespread browser and device support for date pickers, and provides yet another interface for people to understand how to pick a date.

Refer: https://caniuse.com/input-datetime

In nearly all cases, the standard date input fields would be a better choice, especially when dealing with dates that are more than a month in the past or future.

The standard date/datetime field willl provide this feature but we can provide a template for this, for the sake of completeness.
Date validation will need to be considered, as the component uses a text input.

@JamesDPC
Copy link
Contributor Author

(added in 3.16.0)

@JamesDPC JamesDPC self-assigned this Mar 14, 2024
@JamesDPC
Copy link
Contributor Author

JamesDPC commented Apr 4, 2024

The extension needs to be applied selectively, i.e not in the modeladmin context. The main issue is that the date picker component requires a text input type.. date input type will work but there are 2 calendar icons.
Modify the input type to text without loading the nswds requirements causes the input field to render as a text field.

@JamesDPC
Copy link
Contributor Author

JamesDPC commented May 3, 2024

With input type="date":

image

image

With input type="text"

image

@JamesDPC
Copy link
Contributor Author

JamesDPC commented May 3, 2024

Date validation will need to be considered, as the component uses a text input.

The implementation only changes the type attribute, not the class, so validation is unaffected.

@JamesDPC
Copy link
Contributor Author

JamesDPC commented May 3, 2024

A possible blocker here is that unlike the standard date input, this component sends dates through in the format dd/mm/yyyy e.g 04/05/2024 for 4th May.

If the date provided in that format is considered to be invalid, the value will not be handled by DateField.

Additionally, adding dates like 11/12/2024 (11 Dec) results in the date being redisplayed in the field (e.g on validation error) as 2024-11-12 (12 Nov)

The standard date input only handle ISO date format and converts to locale format which solves this issue.

@JamesDPC JamesDPC added the parked Item is parked until further information/changes are available label May 8, 2024
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
parked Item is parked until further information/changes are available
Projects
None yet
Development

No branches or pull requests

1 participant