Date Field Form Validation Failure in Some Browsers

Support Forms & Blueprints
1

Problem: Same one mentioned below two years ago:

Dateformat in form datefield? -> Validation failed: Invalid input

Validation fails on the date field because it’s looking for a specific format, yyyy-mm-dd. But this is only happening in lesser browsers that don’t have the date calendar pulldown tool where a date can be clicked on. Strange though that when the calendar tool is available (in most browsers), it puts a placeholder in the field formatted as mm/dd/yyyy, allows you to type the date that way, yet delivers the date to the submitted data file and/or email as yyyy-mm-dd. And that’s how I figured out what I needed to do as a workaround.

My workaround:
I put a placeholder showing the default date format the form is looking for which shows up only in those browsers that don’t have the pulldown calendar. For example:

    arrival:
        type: date
        label: 'Requested Arrival Date'
        placeholder: yyyy-mm-dd

It would be nice though if I knew where the default date format is set for forms in the Grav code. Then maybe it could be changed to mm/dd/yyyy, as most people filling out my client’s forms would type it.

If anyone knows, please respond.

1 Like
2

I found the answer to my question as to where a form’s date field gets its format of yyyy-mm-dd. The datepicker.js file, which I assume is what generates the form’s calendar pulldown tool, is located here -> /user/plugins/uikitifier/js/components/

But since it’s not something that should be messed with and yyyy-mm-dd is a logical format for dates anyway, I’ll now call my workaround of putting a “yyyy-mm-dd” placeholder in the date field for those few browsers that don’t display the datepicker component THE SOLUTION.

That should keep those filling out the form from entering the date using the wrong format such as mm/dd/yy and ending up with a field validation error even when validation is not set for the date field.