Convert Date to YYYY-MM-DD

Question

I have an input type of date that works in all browsers (HTML5 for Chrome, and some javascript to make it work in IE11 and Firefox).

<input type="date" name="Date" id="Date" min="2016-10-19" max="2016-11-03"/>

But a weird thing is happening. If I select a date in Chrome it gets posted to my database, but if I select a date in IE11 or Firefox, it gets rejected as an invalid format.

My Scripts are currently inside the HTML, which is why it looks like this:

        <script type="text/javascript">
        var datefield=document.createElement("input")
        datefield.setAttribute("type", "date")
        if (datefield.type!="date"){ //if browser doesn't support input type="date", load files for jQuery UI Date Picker
            document.write('<link href="css/jquery-ui.css" rel="stylesheet" type="text/css" />\n')
            document.write('<script src="scripts/jquery.min.js"><\/script>\n')
            document.write('<script src="scripts/jquery-ui.min.js"><\/script>\n')
        }
    </script>
    <script type="text/javascript">
        if (datefield.type!="date"){ //if browser doesn't support input type="date", initialize date picker widget:
            jQuery(function($){ //on document.ready
                $('#Date').datepicker({
                    showOtherMonths: true,
                    selectOtherMonths: true,
                    changeMonth: true,
                    minDate: '10/19/2016',
                    maxDate: '11/03/2016',
                });
            })
        }
    </script>

This would be a good use case for Moment.js you would simply pass it any date and specify the required output and viola! — Justin Herter, Oct 19 '16 at 22:34
Possible duplicate of [Where can I find documentation on formatting a date in JavaScript?](http://stackoverflow.com/questions/1056728/where-can-i-find-documentation-on-formatting-a-date-in-javascript) — Matt Holland, Oct 19 '16 at 22:38
Nothing "weird" about this. Per specification, a date input field always formats the date values as `yyyy-mm-dd` for submission, whereas jQuery's datepicker uses a default format of `mm/dd/yy` - and MySQL does not like the later format, but has no problem with the former. — CBroe, Oct 19 '16 at 22:43
Why not use the same format for both, or send a Unix timestamp instead, jQuery makes it easy to `.datepicker('getDate')` and the native date input uses ISO dates that can be passed to `new Date` — adeneo, Oct 19 '16 at 22:44
you can use a string substitution function onsubmit to convert your date into a date format your database accepts. — Jay Lane, Oct 20 '16 at 03:27

score 0 · Answer 1 · answered Oct 20 '16 at 18:36

GOT IT! Had to add the dateFormat property and orient the yy-mm-dd the way my database needed it. I assume you can change it to dd/mm/yy or yy/mm/dd, however you need it arranged.

<script type="text/javascript">
        if (datefield.type!="date"){ //if browser doesn't support input type="date", initialize date picker widget:
            jQuery(function($){ //on document.ready
                $('#Date').datepicker({
                    dateFormat: 'yy-mm-dd',
                    showOtherMonths: true,
                    selectOtherMonths: true,
                    changeMonth: true,
                    minDate: '2016-10-19',
                    maxDate: '2016-11-03'
                });
            })
        }
    </script>

Convert Date to YYYY-MM-DD

1 Answers1