javascript accepting multiple date format

Question

I should preface this post by saying that I am a very elementary developer with a generic IS degree. Without going into too much detail, I was given a moderately large web application from an interning software engineer to support an enhance if need be. It was written primarily in Python, JavaScript and HTML5 and utilizes a Google Map API to visually represent the location and uses of given inputs. This leads me to my question.

There is a date picker modal that the application/user utilizes. They pick a START and END date, in the default format YYYY-MM-DD (if the user does not use that exact format (i.e. 2015-09-29) the date picker will not work), and the application then goes to the DB and picks the given inputs between those dates and represents them on the map. I have been told that, for usability, I have to make the program accept multiple date formats (i.e. September 29 2015, 09-29-2015, 9-29-2015, 9/29/2015). How would I go about doing this?

possible duplicate of [Javascript date regex DD/MM/YYYY](http://stackoverflow.com/questions/5465375/javascript-date-regex-dd-mm-yyyy) — Cisum Inas, Sep 29 '15 at 15:09
http://stackoverflow.com/questions/11566560/dynamic-smart-date-mask-while-inserting-date — rogerdeuce, Sep 29 '15 at 15:10

score 0 · Answer 1 · answered Sep 29 '15 at 15:08

You can use Javascript to give the user the feedback that the correct format(s) is being used. But if you are taking any data to your server be sure verify the data on the server.

To verify the correct dataformat you can use Regular expressions and check if any format is correct. You should iterate through all allowed possibilities until one is found correct.

I wrestled a bear once. · Answer 2 · 2015-09-29T15:24:03.397

0

Your best bet from the user-experience standpoint is not to try and parse multiple formats but to normalize the input being accepted.

For dates, wouldn't you rather use a calendar picker instead of manually typing in the dates?

Have a look at this jQuery solution, or you can Google, there are plenty that don't use jQuery, and you can usuaslly specify the outupt format so you get the format you require.

Here's an example doing what you want: http://jsfiddle.net/ezygkgxt/

HTML

<label>Date: <input name='date' /></label>
<input type='hidden' id='actualDate' />

JS

$("input[name='date']").datepicker({
  altFormat: "yy-mm-dd",
    altField: "#actualDate"
});

$("input[name='date']").change(function(){
    window.alert("The current chosen date is: "+$("#actualDate").val());
});

edited Sep 29 '15 at 15:24

answered Sep 29 '15 at 15:11

I wrestled a bear once.

22,983
19
69
116

thanks for the response! Turns out that this application does indeed already have a calendar picker built into it. However, during our tests, we found out that this calendar pick is not supported on IE11. Any thoughts? It is supported on Chrome. – mleone99 Sep 30 '15 at 14:31
@mleone99 You could change to a calendar that does support IE11. The one in my example supports IE8+. But if you're totally against that idea, you might want to look at the masked inputs plug in which formats and validates as you type into an input, automatically inserting the hyphens for the date, etc. Also requires jQ though. – I wrestled a bear once. Sep 30 '15 at 15:00

javascript accepting multiple date format

2 Answers2