Question

Is there any jquery datepicker that consumes json data… My json data would be a list of future dates that belongs to any month should be consumed by my datepicker which should be disabled and highlighted with a color….

Answer 1

My datepicker provides this functionality using a “renderCallback”.

This example shows all weekends styled differently and disabled:

http://www.kelvinluck.com/assets/jquery/datePicker/v2/demo/datePickerCustomCellRender.html

And this much more complex example shows setting up different rules based on settings made on the page:

http://www.kelvinluck.com/assets/jquery/datePicker/v2/demo/datePickerLimitAvailableDatesAjax2.html

Basically you will instantiate the datePicker something like this:

Date.format = 'yyyy-mm-dd';

// Your data loaded from json - note the date formats match the Date.format you set above
var disabledDates = {'2010-04-21' : true, '2010-05-15' : true};

$('SELECTOR').datePicker(
    {
        renderCallback:function ($td, thisDate, month, year)
        {
            if (disabledDates[thisDate.asString()]) {
                // disabled prevents the date from being selectable, highlight is a hook you can style...
                $td.addClass('disabled highlight');
            }
        }
    }
)

Hope it helps 🙂