From ef8976b22891da2e4e2d16bf936bdd51ca34407d Mon Sep 17 00:00:00 2001 From: Thomas Wana Date: Fri, 25 Mar 2016 10:11:15 +0100 Subject: [PATCH] Documentation update for setDateFormatter --- doc.tpl | 49 +++++++++++++------------------------------------ 1 file changed, 13 insertions(+), 36 deletions(-) diff --git a/doc.tpl b/doc.tpl index b9bf466..d1d21a8 100644 --- a/doc.tpl +++ b/doc.tpl @@ -362,41 +362,18 @@ jQuery('#_datetimepicker_weekends_disable').datetimepicker({ }); // ]]>
-

Use other date parser#

-

Date-functions library, Baron Schwartz, used in DateTimePicker for parse and format datetime certainly good, but it is licensed under the LGPL. It is not bad and not good. In this example, you see how use other date parse library

-

Before start, remove code below jquery.datetimepicker.js. Remove all after comment

-
// Parse and Format Library
-

After this add in page next code, as previously

-
<script src="jquery.datetimepicker.js"></script>
-

After this you must define two methods for Date object

-
Date.parseDate = function( input, format ){
-  // you code for convert string to date object
-  // simplest variant - use native Date.parse, not given format parametr
-return Date.parse(input);
-};
-Date.prototype.dateFormat = function( format ){
-  //you code for convert date object to format string
-  //for example
-  switch( format ){
-    case 'd': return this.getDate();
-    case 'H:i:s': return this.getHours()+':'+this.getMinutes()+':'+this.getSeconds();
-    case 'h:i a': return ((this.getHours() %12) ? this.getHours() % 12 : 12)+':'+this.getMinutes()+(this.getHours() < 12 ? 'am' : 'pm');
-  }
-  // or default format
-  return this.getDate()+'.'+(this.getMonth()+ 1)+'.'+this.getFullYear();
-};
-

It is only example, it is not real code. For real project this.getDate() must be replace to (this.getDate()<0:'0':'')+this.getDate()

-

This approach will work in a particular project, but does not work in another. Therefore use the other libraries for working with dates - Moment.js.

-

How to use moment.js with jquery datetimepicker

-

Add this code in page

-
<script src="http://momentjs.com/downloads/moment.min.js"></script>
-

After this, again re-define 2 methods

-
Date.parseDate = function( input, format ){
-  return moment(input,format).toDate();
-};
-Date.prototype.dateFormat = function( format ){
-  return moment(this).format(format);
-};
+

Use another date parser/formatter#

+

By default, datetimepicker uses php-date-formatter for parsing and formatting the date and time displayed. You can replace the library by setting a custom DateFormatter. Simply supply an object that implements the parseDate and formatDate methods. This example uses the popular MomentJS library:

+
$.datetimepicker.setDateFormatter({
+    parseDate: function (date, format) {
+        return moment(date, format);
+    },
+    
+    formatDate: function (date, format) {
+        return moment(date).format(format);
+    }
+});
+

After this, you can init datetimepicker with moment.js format

jQuery('#datetimepicker').datetimepicker({
   format:'DD.MM.YYYY h:mm a',
@@ -992,4 +969,4 @@ $('button.somebutton').on('click', function () {
     var d = $('#input').datetimepicker('getValue');
     console.log(d.getFullYear());
 });
-
\ No newline at end of file +