jQuery UI Datepicker Today Link

Question

I\'m using the jQuery UI Datepicker for a project, but need the today button to enter the date into the textfield when a user clicks on it. By default it just selects the da

Answer 1

I found a solution that works here: http://forum.jquery.com/topic/jquery-ui-datepicker-today-button. Just use this snippet of jQuery (I just put it in with my datepicker init code):

$('button.ui-datepicker-current').live('click', function() {
    $.datepicker._curInst.input.datepicker('setDate', new Date()).datepicker('hide');
});

The only problem I had was that focus would remain in the input box after clicking the "today" button, which means you cant click it again to select a different date. This can be fixed by suffixing blur():

$('button.ui-datepicker-current').live('click', function() {
    $.datepicker._curInst.input.datepicker('setDate', new Date()).datepicker('hide').blur();
});

I also didn't like the styling on the "today" button - maybe it was just my theme or something, but the today button was kind of greyed out compared to the "done" button. This can be fixed with the following CSS (may vary for different themes, i'm not sure):

/* This edit gives five levels of specificity, thus making it override other styles */
.ui-datepicker div.ui-datepicker-buttonpane button.ui-datepicker-current {
    font-weight: bold;
    opacity: 1;
    filter:Alpha(Opacity=100);
}