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

Text input date validation #3805

Merged
merged 4 commits into from
Jan 7, 2025

Conversation

nichwall
Copy link
Contributor

@nichwall nichwall commented Jan 7, 2025

Brief summary

This PR adds a check for a non-null value for date-time fields in the web client to ensure null is not incorrectly submitted.

Which issue is fixed?

Fixes #3775 and partially fixes #1519

In-depth Description

The submit button now checks that the date-time field to ensure that it is non-null. The datetime will be null if any field (day, month, year, hour, minute) is not set. I added a new error toast to inform the user of the date not being formatted correctly.

We could have the UI element default to 12:00 AM if only the time is not specified, such as is mentioned in #1519, as well as to ensure that different browsers render the "default" time correctly, such as Safari in #3775.

How have you tested this?

Tested the web client with fully valid datetimes, each individual field missing, and no change to the date.
Tested using Firefox.

Screenshots

error toast on edit screen

@nichwall nichwall marked this pull request as ready for review January 7, 2025 04:57
@nichwall
Copy link
Contributor Author

nichwall commented Jan 7, 2025

I spent some more time trying to figure out how to get the hours and minutes to automatically set to 12:00 if not set, but could not figure it out, so just leaving it as a submission error if everything is not set.

@advplyr
Copy link
Owner

advplyr commented Jan 7, 2025

There was an issue with this in that you couldn't remove the pub date after it was already set. I'm not sure why you would want to do that but it should still be possible.

I made some updates using the validation set on the datetime input.

I don't think it is possible to automatically set the time to 12:00 AM unless we create our own datetime input.

As far as I know it is not possible to get the value of an incomplete or invalid date in a native HTML datetime input. The "value" on the HTML input is only set when the date is valid. If you enter "6/31/2024 12:00 AM" it will still not populate the value.

The validity object is set though which we can use to check for any bad input. When the date is not set at all validity.badInput is false, so we can use this to check if we should show the error toast message or not.

image

I also added a red border anytime badInput is true as well as updated the toast message to cover both invalid and incomplete.

image

image

@advplyr
Copy link
Owner

advplyr commented Jan 7, 2025

Thanks!

@advplyr advplyr merged commit e618119 into advplyr:master Jan 7, 2025
6 checks passed
@nichwall
Copy link
Contributor Author

nichwall commented Jan 7, 2025

Thanks for cleaning that up! I figured there was a better way to do it, I was mostly just trying to get the framework sorted out.

@nichwall nichwall deleted the text_input_date_validation branch January 7, 2025 21:45
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
2 participants