xdan/datetimepicker use “momenjs” instead default

问题:

I am trying to use datetimepicker and I have these functions to override date formatting. In other places we use momentjs for date time formatting.

There is my plunker example.

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

Use momentjs formats for datetimepicker:

format: "DD/MM/YYYY H:mm:ss",
formatTime: 'H:mm',
formatDate: 'DD/MM/YYYY',

But when using moment the "highlighted days" function does not work.

How to make that "highlighted days" function were working?

回答1:

Found solution:

$(document).ready(function() {

  var myFormatter = {
    parseDate: function(vDate, vFormat) {          
      return moment(vDate, vFormat).toDate();
    },
    guessDate: function(vDateStr, vFormat){          
      return moment(vDateStr, vFormat).toDate();
    },
    parseFormat: function(vChar, vDate){          
      return vDate; // date string (I guess)

    },        
    formatDate: function(vChar, vDate) {               
      return moment(vChar).format(vDate);
    },

  };

  jQuery.datetimepicker.**setDateFormatter**(myFormatter);


  jQuery('#datetimepicker').datetimepicker({
    timepicker: true,

    // 'd/m/y'format is requared for datetimepicker days HIGHLIGHT function to work!!!
    //Date, time formating: http://php.net/manual/en/function.date.php
    step: 15,
    /*
    // momentJs formating
     format: "d/m/Y H:i:s",
    formatTime: "H:i",
    formatDate: "d/m/Y",
    */

    format: "DD/MM/YYYY H:mm:ss",
    formatTime: 'H:mm',
    formatDate: 'DD/MM/YYYY', //I need to use this format, but it works only when using "d/m/Y" - so somewhere the php date formater is still used..

    highlightedDates: [
      "01/09/2016,,xdsoft_highlighted_mint",
      "02/09/2016,,xdsoft_highlighted_mint",
      "03/09/2016,,xdsoft_highlighted_mint",
      "06.09/2016",
      "07.09.2016",
      "08.09.2016",
      "12.09.2016,Christmas Eve,xdsoft_highlighted_mint",
      "13.09.2016,Christmas Day,xdsoft_highlighted_mint",
      "14.09.2016,Christmas Day,xdsoft_highlighted_mint",
      "26.09.2016,,xdsoft_highlighted_mint"
    ]
  });

There is working plunker example

The main issues are is my case is browserify/gulp modules concatenation.. And that datetimepicker is undefined under jquery...

So trying to change building to WebPack....