Jquery Datepicker trigger after changing month (after month renders)

Question

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?

Answer 1

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.

Answer 2

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...

Answer 3

        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)
    }