I want to highlight some days in the current month. I can do this on the first month, but not on a new month after "next month" or "prev month" is clicked. I tried using onChangeMonthYear event but this executes before the new (or prev) month renders.
any ideas?
Probably your best choice is going to be the beforeShowDay
callback.
http://jqueryui.com/demos/datepicker/#event-beforeShowDay
You can specify a new class name for the cell, based on whatever your date criteria is.
You can do this with my jQuery datepicker using a custom "renderCallback".
e.g. This example disables weekends and adds a class for styling those days. There are lots of other more complex examples which might help too...
$('.date-pick')
.datePicker(
{
renderCallback:function($td, thisDate, month, year)
{
if (thisDate.isWeekend()) {
$td.addClass('weekend');
$td.addClass('disabled');
}
}
}
);
Also, if you would prefer, there is a dpMonthChanged event once the calendar has re-rendered and you can loop over the contents of the calendar and do your highlighting...
hack:
$('#calendar').datepicker({
onChangeMonthYear: function (year, month, inst) {
setEventsDay()
}
});
function setEventsDay(){
var days = $(".ui-state-default");
console.log(days.length); //31 from august to Sep
setTimeout(function () {
var days = $(".ui-state-default");
console.log(days.length); //30 `enter code here`from august to Sep
}, 100)
}