I would like to extend the jQuery UI datepicker widget (and name it datepickerHelp), which is based on the jQuery UI datepicker widget . The reason I'm interested in the extension, rather than directly changing the source of the jQuery user interface, is because the extension will allow me to configure the jQuery interface on a server with a fast CDN.
An extension will do two things:
- Overrides the Today button, so when it is pressed, today's date is selected and the date picker closes.
- Prepare a help icon in front of the Today button.
I created this script to demonstrate what I'm looking for, but it does not work, because the Today button does nothing and the help icon disappears when the Previous and Next buttons are clicked to change the months. Here is the javascript:
$.widget("ui.datepickerHelp", { _init: function() { var $el = this.element; $el.datepicker(this.options); }, _gotoToday: function(id) { var target = $(id); var inst = this._getInst(target[0]); if (this._get(inst, 'gotoCurrent') && inst.currentDay) { inst.selectedDay = inst.currentDay; inst.drawMonth = inst.selectedMonth = inst.currentMonth; inst.drawYear = inst.selectedYear = inst.currentYear; } else { var date = new Date(); inst.selectedDay = date.getDate(); inst.drawMonth = inst.selectedMonth = date.getMonth(); inst.drawYear = inst.selectedYear = date.getFullYear();
My demo was paved from these SO answers:
- Irvin Dominin answers this question shows an example of how to extend the datepicker, which I used as a starting point.
- This example uses the Today button, but it is not “packaged” as an extension where the existing _gotoToday method is correctly overridden.
- This example tries to access the help icon, but since it is implemented in the beforeShow method, the icon disappears when navigating the calendar. The solution I need is to modify the existing button bar and is “packaged” into one extension.
Can someone fix my demo to be a proper extension or to provide pointers or resources explaining how to extend the jQuery UI datepicker?
jquery-ui jquery-plugins jquery-ui-datepicker
ESS Dec 09 '16 at 17:47 2016-12-09 17:47
source share