Jquery Date Formator Plugin


/ Published in: JavaScript
Save to your folder(s)

I always find issue when we want to show date in different format i.e other than mysql default format. (YYYY-MM-DD) using jquery plugin this date format can be converted into any specified date format i.e indian,US,Europe from any html element


Copy this code and paste it in your HTML
  1. <script language="javascript">
  2. //Date formattor plugin
  3.  
  4. //replace YYYY-MM-DD(Mysql default date format) in user specified custom date format
  5. //usage example $('JQUERY_SELECTOR').dateFormator('M-ddd-yyyy');
  6. //dependency jquery.js download from jquery.com
  7. //dependency date.js download from http://code.google.com/p/datejs/downloads/detail?name=date.js&can=2&q=
  8. //for allowed date format specifier see below
  9. /*
  10.   Format Description Example
  11.   ------ --------------------------------------------------------------------------- -----------------------
  12.   s The seconds of the minute between 0-59. "0" to "59"
  13.   ss The seconds of the minute with leading zero if required. "00" to "59"
  14.  
  15.   m The minute of the hour between 0-59. "0" or "59"
  16.   mm The minute of the hour with leading zero if required. "00" or "59"
  17.  
  18.   h The hour of the day between 1-12. "1" to "12"
  19.   hh The hour of the day with leading zero if required. "01" to "12"
  20.  
  21.   H The hour of the day between 0-23. "0" to "23"
  22.   HH The hour of the day with leading zero if required. "00" to "23"
  23.  
  24.   d The day of the month between 1 and 31. "1" to "31"
  25.   dd The day of the month with leading zero if required. "01" to "31"
  26.   ddd Abbreviated day name. Date.CultureInfo.abbreviatedDayNames. "Mon" to "Sun"
  27.   dddd The full day name. Date.CultureInfo.dayNames. "Monday" to "Sunday"
  28.  
  29.   M The month of the year between 1-12. "1" to "12"
  30.   MM The month of the year with leading zero if required. "01" to "12"
  31.   MMM Abbreviated month name. Date.CultureInfo.abbreviatedMonthNames. "Jan" to "Dec"
  32.   MMMM The full month name. Date.CultureInfo.monthNames. "January" to "December"
  33.  
  34.   yy The year as a two-digit number. "99" or "08"
  35.   yyyy The full four digit year. "1999" or "2008"
  36.  
  37.   t Displays the first character of the A.M./P.M. designator. "A" or "P"
  38.   $C.amDesignator or Date.CultureInfo.pmDesignator
  39.   tt Displays the A.M./P.M. designator. "AM" or "PM"
  40.   $C.amDesignator or Date.CultureInfo.pmDesignator
  41.  
  42.   S The ordinal suffix ("st, "nd", "rd" or "th") of the current day. "st, "nd", "rd" or "th"
  43.   */
  44. </script>
  45. <script type="text/javascript" src="date.js"></script>
  46. <script type="text/javascript" src="jquery.js"></script>
  47. <script type="text/javascript">
  48. (function($){
  49.  
  50. //Attach this new method to jQuery
  51. $.fn.extend({
  52.  
  53. //This is plugin
  54. dateFormator: function(dateformat) {
  55.  
  56. //Iterate over the current set of matched elements
  57. return this.each(function() {
  58. var result='';
  59. var newresult='';
  60. var dt='';
  61. //pattern to be match here
  62. var patt=/(\d{4}-\d{2}-\d{2})\b/gm; //replace match in yyyy-MM-dd format
  63. var str=$(this).html();
  64. //newresult=str;
  65. result=str.match(patt);
  66. if(result!=null){
  67. if(result.length==1){
  68. dt=Date.parseExact(result,"yyyy-MM-dd");
  69. str=str.replace(eval('/'+result+'/gi'),dt.toString(dateformat));
  70. }else{
  71. for(i=0;i<result.length;i++){
  72. dt=Date.parseExact(result[i],"yyyy-MM-dd");
  73. // alert(result[i]+'----'+dt.print(dateformat));
  74.  
  75. str= str.replace(eval('/'+result[i]+'/gi'),dt.toString(dateformat));
  76. }
  77. }
  78. }
  79. //alert(str);
  80. $(this).html(str);
  81. });
  82. }
  83. });
  84.  
  85. //pass jQuery to the function,
  86.  
  87. })(jQuery);
  88. </script>

Report this snippet


Comments

RSS Icon Subscribe to comments

You need to login to post a comment.