datapicker special dates selectibel false or true
by Akram kamal
HTML
Date:
<div id="datepicker"></div>
CSS
body {
font-family:Arial;
font-size : 6pt;
padding:1px;
}
.Highlighted a {
background-color : Green !important;
background-image :none !important;
color: White !important;
font-size: 6pt;
padding:1px;
}
.newHailight a {
background-color : Blue !important;
background-image :none !important;
color: White !important;
font-size: 6pt;
padding:1px;
}
JavaScript
$(function () {
var date1 = new Date('05/02/15');
var date2 = new Date('05/12/15');
var date3 = new Date('06/01/15');
var date4 = new Date('06/11/15');
$("#datepicker").datepicker({
numberOfMonths: [4, 3],
onSelect: function (date) {
alert(date)
},
beforeShowDay: function (date) {
var period1 = date >= date1 && date <= date2,
period2 = date >= date3 && date <= date4
return [
!( period1 || period2),
period1 ? 'Highlighted' : period2 ? "newHailight" : "",
period1 ? 'Period 1' : period2 ? "Period 2" : ""
];
}
});
});