Date handling

[Jeremy]

We have some date fields in our HTML forms in various places. In the
accounts package we use, there is some pretty nifty date handling.

It has a standardised date format of dd/mm/yyyy and if you enter e.g.

3-12 it will switch it to 3/12/2005

Same applies for e.g. 3:12 etc

Anyone know of some javascript which will do this for our HTML form
fields? Our target format is actually dd-mon-yyyy and it would make it
really nice for users if the system could accept a variety of input
formats and then switch it to a date to our specification. Any
suggestions?

 

[Mick White]

We have some date fields in our HTML forms in various places. In the
accounts package we use, there is some pretty nifty date handling.

It has a standardised date format of dd/mm/yyyy and if you enter e.g.

3-12 it will switch it to 3/12/2005

Same applies for e.g. 3:12 etc

Anyone know of some javascript which will do this for our HTML form
fields? Our target format is actually dd-mon-yyyy and it would make it
really nice for users if the system could accept a variety of input
formats and then switch it to a date to our specification. Any
suggestions?

The task is trivial, but first you need to ensure that your users can
not introduce ambiguities.
A sample:
http://www.mickweb.com/demo/datepicker.html
Mick

 

[Jeremy]

The task is trivial, but first you need to ensure that your users can
not introduce ambiguities.
A sample:
http://www.mickweb.com/demo/datepicker.html

Thanks Mick, perhaps I didn't make myself clear. From what I see, you
are enabling the user to select a date from 3 individual fields and then
displaying the resultinto a 4th field

What I am looking to acheive is a single text field in which the user
may type e.g. 3/12/05 and which, as the cursor leaves the field, is
reformatted to 3-dec-2005.

You said it is trivial: is it really?

thanks

 

[Dr John Stockton]

JRS: In article <[email protected]>, dated
Tue, 25 Oct 2005 15:32:24, seen in Jeremy

We have some date fields in our HTML forms in various places. In the
accounts package we use, there is some pretty nifty date handling.

It has a standardised date format of dd/mm/yyyy and if you enter e.g.

3-12 it will switch it to 3/12/2005

Same applies for e.g. 3:12 etc

Anyone know of some javascript which will do this for our HTML form
fields? Our target format is actually dd-mon-yyyy and it would make it
really nice for users if the system could accept a variety of input
formats and then switch it to a date to our specification. Any
suggestions?

If you allow an adaptive variety, you need to be reasonably sure that
there are no unexpected cases that are misinterpreted, because your
users may not notice that the switched form is not as expected.

Better IMHO to provide a set of radio-buttons and/or checkboxes to
choose the current format, and to display by onChange or similar the
date of Christmas in the currently selected format.

Do you go as far as allowing 25.XII.2005, 33/11/22, and 2005-W51-7, for
example?

You could try reading the newsgroup FAQ; see below.

 

[Mick White]

Jeremy wrote:

Thanks Mick, perhaps I didn't make myself clear. From what I see, you
are enabling the user to select a date from 3 individual fields and then
displaying the resultinto a 4th field

What I am looking to acheive is a single text field in which the user
may type e.g. 3/12/05 and which, as the cursor leaves the field, is
reformatted to 3-dec-2005.

You said it is trivial: is it really?

Yes, but you can never be sure what the user will enter.

function convertDate(value){
var v=value.split(/[^\d]/);
v[1]=
['jan','feb','mar','apr','may','jun','jul','aug','sep','oct','nov','dec'][v[1]-1];
return v.join("-");
}

alert("3/12/05") // "3-dec-2005"


<input ... onchange="this.value=convertDate(this.value)">

You're aware that "3/12/2005" is interpreted as "March 12, 2005" in
North America, are you not?
Mick.

 

[Matt Kruse]

It has a standardised date format of dd/mm/yyyy and if you enter e.g.
3-12 it will switch it to 3/12/2005
Same applies for e.g. 3:12 etc
Anyone know of some javascript which will do this for our HTML form
fields?

Using my generalized date functions at
http://www.javascripttoolbox.com/date/
you could do something like this:

<input type="text" name="date"
onChange="var d=parseDate(this.value);if(d==null){alert('Date format not
recognized!');}else{this.value=formatDate(d,'dd-MMM-yyyy)}">

With the default code, it would automatically recognize and parse dates in
these formats:
y-M-d MMM d, y MMM d,y y-MMM-d d-MMM-y MMM d
M/d/y M-d-y M.d.y MMM-d M/d M-d
d/M/y d-M-y d.M.y d-MMM d/M d-M

You could modify the parseDate function to easily parse more date formats.

You should of course be aware that some values entered will be ambiguous.
1/2/2000 can mean Jan 2, 2000 just as well as Feb 1, 2000, depending on
locale.

 

[Jeremy]

If you allow an adaptive variety, you need to be reasonably sure that
there are no unexpected cases that are misinterpreted, because your
users may not notice that the switched form is not as expected.

Yes you are quite right. This is however an administrative application
as opposed to something that any member of the public may use and hence
training etc on the behaviour of the system will be available - and they
will know that the target date format is dd-mon-yyyy.

Better IMHO to provide a set of radio-buttons and/or checkboxes to
choose the current format, and to display by onChange or similar the
date of Christmas in the currently selected format.

Do you go as far as allowing 25.XII.2005, 33/11/22, and 2005-W51-7, for
example?

You could try reading the newsgroup FAQ; see below.

Thanks for the pointer.

 

[Jeremy]

You said it is trivial: is it really?

Yes, but you can never be sure what the user will enter.

function convertDate(value){
var v=value.split(/[^\d]/);
v[1]=
['jan','feb','mar','apr','may','jun','jul','aug','sep','oct','nov','dec'][v[1]-1];
return v.join("-");
}

alert("3/12/05") // "3-dec-2005"


<input ... onchange="this.value=convertDate(this.value)">

Thanks, that's very helpful.

You're aware that "3/12/2005" is interpreted as "March 12, 2005" in
North America, are you not?

Noted ta.

 

[Jeremy]

Using my generalized date functions at
http://www.javascripttoolbox.com/date/
you could do something like this:

<input type="text" name="date"
onChange="var d=parseDate(this.value);if(d==null){alert('Date format not
recognized!');}else{this.value=formatDate(d,'dd-MMM-yyyy)}">

With the default code, it would automatically recognize and parse dates in
these formats:
y-M-d MMM d, y MMM d,y y-MMM-d d-MMM-y MMM d
M/d/y M-d-y M.d.y MMM-d M/d M-d
d/M/y d-M-y d.M.y d-MMM d/M d-M

You could modify the parseDate function to easily parse more date formats.

OK that looks interesting too.

You should of course be aware that some values entered will be ambiguous.
1/2/2000 can mean Jan 2, 2000 just as well as Feb 1, 2000, depending on
locale.

Thanks for the reminder.