JQuery DatePicker - How to show today month instead of selected date?
So I searched all over the place for the answer. Including the jQuery datepicker API site and I can't seem to find a suitable answer.
Here's what I would like to do. When the textbox is clicked and the datepicker pops up, I would like the calendar to be shown for this month and not the default for any previously selected date.
I still want to be able to choose the next and the previous month. Therefore setting minDate is not an option.
So, for example, the user preselected 03/03/2013. The user then clicks on the textbox which reappears in the date picker, the month is displayed by month instead of month. However, 03/03/2013 is still selected.
Thank!
The code is very vanilla ...
$(document).ready(function () {
$(".datePickerShowToday").datepicker({
dateFormat: 'dd/mm/yy',
buttonText: 'Click here to select a date',
onSelect: function () {
}
});
});
HTML code:
<input type="text" id="NotificationDate" class="datePickerShowToday" />
source to share
You can do it with the function $.datepicker._gotoToday
[this is what the datepicker uses for Ctrl+ Home]. However, the widget does not provide an event open
(it does beforeShow
, but that won't work in your case, since it only executes before the widget is drawn). You can simulate this by using .focus
in the input field and only binding one handler at a time (since focusing on the datepix itself also triggers focus
):
$( ".datePickerShowToday" ).datepicker({
onClose: function() {
$( ".datePickerShowToday" ).one("focus", function() {
$.datepicker._gotoToday(this);
});
}
});
$( ".datePickerShowToday" ).one("focus", function() {
$.datepicker._gotoToday(this);
});
Here's the script from above: http://jsfiddle.net/4vskg74t/
source to share