jQuery UI DatePicker change highlighted “today” date

Question

I would like to explicitly change the highlighted today\'s date in jQuery Datepicker. I\'ve tried setting the default date but still the highlighted date is my local compute

Answer 1

use $( ".selector" ).datepicker({ defaultDate: -1 });

Answer 2

Small tweak to @haxxxton's that allows you to pass in the localToday as an option in the datepicker.

// Get users 'today' date
var localToday = new Date();
localToday.setDate(tomorrow.getDate()+1); // tomorrow

// Pass the today date to datepicker
$( "#datepicker" ).datepicker({
    showButtonPanel: true,
    localToday: localToday    // This option determines the highlighted today date
});

I've overridden 2 datepicker methods to conditionally use a new setting for the "today" date instead of a new Date(). The new setting is called localToday.

Override $.datepicker._gotoToday and $.datepicker._generateHTML like this:

$.datepicker._gotoToday = function(id) {
    /* ... */
    var date = inst.settings.localToday || new Date()
    /* ... */
}

$.datepicker._generateHTML = function(inst) {
    /* ... */
    tempDate = inst.settings.localToday || new Date()
    /* ... */
}

Here's a demo which shows the full code and usage: http://jsfiddle.net/NAzz7/5/

Answer 3

Unfortunately, 'Today' is calculated at the HTMLRendering stage of the DatePicker, this means that in order to 'override' you need to redefine the _generateHTML method of $.datepicker. Ive also found that the 'Today' button in it's default state gets broken by this override, so it is necessary to override that method too.

Basically the datepicker sets an internal variable like this 'tempDate = new Date()' and then uses that to create 'today'. All we do is override that variable with some timezone offsetting code, and the rest sorts itself out.

In the below demo, at the top is a variable for appLocalTimezone, set this to your desired timezone and it will updated the datepicker based on the app. All credit for original code/answers are in the fiddle

jsFiddle Demo