Date formatting with jQuery UI

If you’re developing for a legacy CMS or an absolute POS in-house built platform, you’ll most likely need to change the way dates are formatted on the page. Using jQuery UI this is possible and here’s how to do it!



HTML
1
2
3
<span class="date">06-Aug-2012</span>
<span class="date">2012/06/Aug</span>
<span class="date">Monday, August 06, 2012</span>
jQuery
1
2
3
4
5
6
7
8
$(document).ready(function () {
    $('span.date').each(function() {
        var dateFormat = $(this).text()
        var dateFormat = $.datepicker.formatDate('MM dd, yy', new Date(dateFormat));
        //alert(dateFormat);
        $(this).html(dateFormat + "<br>");
    });
});​
Date Formatting options: http://docs.jquery.com/UI/Datepicker/formatDate

Leave a Reply

Your email address will not be published. Required fields are marked *

*


3 + 3 =

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>