Search code examples
datetimepickerjquerydatetimepicker

xdan/datetimepicker How to Highlight days?

We are using this Date Time Picker ("jquery-datetimepicker": "2.4.0"). Site is using knockout.

There is mentioned about hilightning day`s in GitHub site, but I did not found any sample in documentation or google.

In example we get from endpoint day list in which data exists. And we want to hilight these days in calender.

Ho to hilight days? Please provide some example... Thanks

Update Did some working demo

$(document).ready(function() {

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

    // 'd/m/y'format is requared for datetimepicker days HIGHLIGHT function to work!!!
    formatDate: "d/m/y",
    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"
    ]
  });
Solution

  • Example can be found here, https://github.com/xdan/datetimepicker/pull/262 (found in the Issues section after a search of the github repo for "highlight")

    jQuery('#datetimepicker').datetimepicker({
 formatDate: "d.m.Y", 
 highlightedDates: [
    "29.04.2015,Meeting with Pete", 
    "24.12.2015,Christmas Eve,xdsoft_highlighted_mint", 
    "25.12.2015,Christmas Day,xdsoft_highlighted_mint", 
    "26.11.2015,Thanksgiving"
 ],
 highlightedPeriods: [
    "27.04.2015,08.05.2015,Business trip", 
    "11.07.2015,31.08.2015,Summer holiday 2015,xdsoft_highlighted_mint", 
    "21.12.2015,01.01.2016,Christmas holiday 2015"
 ]
});