jquery-dateFormat - It’s a jQuery Plugin that I made to formatting java.util.Date.toString output using JavaScript.

This plugin is also available on jQuery Plugin page:

plugins.jquery.com/project/jquery-dateFormat

Blog post to explain the plugin usage:

pablocantero.com/blog/2010/09/04/jquery-plugin-javascript-for-java-util-date-tostring-format/

Format patterns¶ ↑

The patterns to formatting are based on java.text.SimpleDateFormat.

download.oracle.com/javase/1.4.2/docs/api/java/text/SimpleDateFormat.html

Date and time patterns¶ ↑

• yy = short year

• yyyy = long year

• M = month (1-12)

• MM = month (01-12)

• MMM = month abbreviation (Jan, Feb … Dec)

• MMMM = long month (January, February … December)

• d = day (1 - 31)

• dd = day (01 - 31)

• ddd = day of the week in words (Monday, Tuesday … Sunday)

• D - Ordinal day (1st, 2nd, 3rd, 21st, 22nd, 23rd, 31st, 4th…)

• h = hour in am/pm (0-12)

• hh = hour in am/pm (00-12)

• H = hour in day (0-23)

• HH = hour in day (00-23)

• mm = minute

• ss = second

• SSS = milliseconds

• a = AM/PM marker

• p = a.m./p.m. marker

Expected input dates formats¶ ↑

• 2009-12-18 10:54:50.546 (default java.util.Date.toString output)

• Wed Jan 13 10:43:41 CET 2010 (???)

• 2010-10-19T11:40:33.527+02:00 (default JAXB formatting of java.util.Date)

• Sat Mar 05 2011 11:47:35 GMT-0300 (BRT) (default JavaScript new Date().toString() output)

• Unix Timestamp (e.g. new Date().getTime())

Examples¶ ↑

Formatting using css classes¶ ↑

<span class="shortDateFormat">2009-12-18 10:54:50.546</span>
<span class="longDateFormat">2009-12-18 10:54:50.546</span>

The default shortDateFormat and longDateFormat are defined in the variables.

jQuery.format.date.defaultShortDateFormat = "dd/MM/yyyy";
jQuery.format.date.defaultLongDateFormat = "dd/MM/yyyy HH:mm:ss";

Output¶ ↑

=> 18/12/2009
=> 18/12/2009 10:54:50

Formatting using JavaScript¶ ↑

<script>
  document.write($.format.date("2009-12-18 10:54:50.546", "Test: dd/MM/yyyy"));
  document.write($.format.date("Wed Jan 13 10:43:41 CET 2010", "dd~MM~yyyy"));
</script>

Output¶ ↑

=> Test: 18/12/2009
=> 18~12~2009

Pretty date formatting¶ ↑

jQuery.format.prettyDate(value) returns a string representing how long ago the date represents

• value = String representing ISO time or date in milliseconds or javascript Date object

jQuery.format.prettyDate(new Date())             // => "just now"
jQuery.format.prettyDate(new Date().getTime())   // => "just now"
jQuery.format.prettyDate("2008-01-28T20:24:17Z") // => "2 hours ago"
jQuery.format.prettyDate("2008-01-27T22:24:17Z") // => "Yesterday"
jQuery.format.prettyDate("2008-01-26T22:24:17Z") // => "2 days ago"
jQuery.format.prettyDate("2008-01-14T22:24:17Z") // => "2 weeks ago"
jQuery.format.prettyDate("2007-12-15T22:24:17Z") // => "more than 5 weeks ago"

toBrowserTimeZone¶ ↑

jQuery.format.toBrowserTimeZone(value, format) converts into browsers timezone.

• value = String representing date in ISO time (“2013-09-14T23:22:33Z”) or String representing default JAXB formatting of java.util.Date (“2013-09-14T16:22:33.527-07:00”) or String representing Unix Timestamp (Sat Sep 14 2013 16:22:33 GMT-0700 (PDT)) or javascript date object.

• format = All input formats valid for jQuery.format.date are valid for this method. The defaut format is MM/dd/yyyy HH:mm:ss.

Valid input formats¶ ↑

var date1 = "2013-09-14T23:22:33Z";
var date2 = "2013-09-14T16:22:33.527-07:00";
var date3 = "Sat Sep 14 2013 16:22:33 GMT-0700 (PDT)";

$.format.toBrowserTimeZone(date1)
$.format.toBrowserTimeZone(date2)
$.format.toBrowserTimeZone(date3)

Test¶ ↑

This plugin was developed using jsunittest.com. To run all tests, open Test.html in your browser.

Licenses¶ ↑

This plugin is licensed under:

MIT License GPL

Do you want to improve jquery-dateFormat¶ ↑

You’re welcome to make your contributions and send them as a pull request.

Contributors¶ ↑

Thanks to all contributors - github.com/phstc/jquery-dateFormat/graphs/contributors.