CODEWITHSUNDEEP
javascriptjqueryhtmljquery-ui
Ayan Bera
Ayan Bera

Reputation: 80

jQuery Datepicker UI Tooltip

Is it possible to add tooltip only to the disabled dates in jQuery datepicker?

$(function() {
    $('#datepicker').datepicker({
        minDate :   0,
        maxDate :   +30,
        beforeShowDay: function(date) {
            return [true, 'highlight', 'The custom title'];
        }
    });
});

My code puts the tooltip to all dates.

Upvotes: 0

Views: 757

Answers (1)

Thangaraja
Thangaraja

Reputation: 956

Yes. It is possible. Check the below link to know more on disabling date.

http://api.jqueryui.com/datepicker/#option-beforeShowDay

Below is the code

var disabledDates = ["11-2-2016","19-2-2016","28-2-2016"];

function disableDate(date) {
  dmy = date.getDate() + "-" + (date.getMonth()+1) + "-" + date.getFullYear();
  if ($.inArray(dmy, disabledDates) < 0) {
    return [true,"",""];
  } else {
    return [false,"","This is disabled"];
  }
}

$('.datePicker').datepicker({ beforeShowDay: disableDate });

Demo : https://jsfiddle.net/j2caztgu/

Upvotes: 2

Related Questions