Permalink
Browse files

Datepicker: bind hover events using delegate. Fixed #7256 - minimize …

…event binding in Datepicker initialization.

(cherry picked from commit 74d195e)
  • Loading branch information...
1 parent 96f6b1a commit 0da176b0062f497b13eddcf4c8312f960019f4d3 @adambaratz adambaratz committed with scottgonzalez Apr 15, 2011
Showing with 27 additions and 20 deletions.
  1. +27 −20 ui/jquery.ui.datepicker.js
View
@@ -16,6 +16,7 @@ $.extend($.ui, { datepicker: { version: "@VERSION" } });
var PROP_NAME = 'datepicker';
var dpuuid = new Date().getTime();
+var instActive;
/* Date picker manager.
Use the singleton instance of this class, $.datepicker, to interact with the date picker.
@@ -107,7 +108,7 @@ function Datepicker() {
autoSize: false // True to size the input for the date format, false to leave as is
};
$.extend(this._defaults, this.regional['']);
- this.dpDiv = $('<div id="' + this._mainDivId + '" class="ui-datepicker ui-widget ui-widget-content ui-helper-clearfix ui-corner-all"></div>');
+ this.dpDiv = bindHover($('<div id="' + this._mainDivId + '" class="ui-datepicker ui-widget ui-widget-content ui-helper-clearfix ui-corner-all"></div>'));
}
$.extend(Datepicker.prototype, {
@@ -173,7 +174,7 @@ $.extend(Datepicker.prototype, {
drawMonth: 0, drawYear: 0, // month being drawn
inline: inline, // is datepicker inline or not
dpDiv: (!inline ? this.dpDiv : // presentation div
- $('<div class="' + this._inlineClass + ' ui-datepicker ui-widget ui-widget-content ui-helper-clearfix ui-corner-all"></div>'))};
+ bindHover($('<div class="' + this._inlineClass + ' ui-datepicker ui-widget ui-widget-content ui-helper-clearfix ui-corner-all"></div>')))};
},
/* Attach the date picker to an input field. */
@@ -672,29 +673,13 @@ $.extend(Datepicker.prototype, {
_updateDatepicker: function(inst) {
var self = this;
var borders = $.datepicker._getBorders(inst.dpDiv);
+ instActive = inst; // for delegate hover events
inst.dpDiv.empty().append(this._generateHTML(inst));
var cover = inst.dpDiv.find('iframe.ui-datepicker-cover'); // IE6- only
if( !!cover.length ){ //avoid call to outerXXXX() when not in IE6
cover.css({left: -borders[0], top: -borders[1], width: inst.dpDiv.outerWidth(), height: inst.dpDiv.outerHeight()})
}
- inst.dpDiv.find('button, .ui-datepicker-prev, .ui-datepicker-next, .ui-datepicker-calendar td a')
- .bind('mouseout', function(){
- $(this).removeClass('ui-state-hover');
- if(this.className.indexOf('ui-datepicker-prev') != -1) $(this).removeClass('ui-datepicker-prev-hover');
- if(this.className.indexOf('ui-datepicker-next') != -1) $(this).removeClass('ui-datepicker-next-hover');
- })
- .bind('mouseover', function(){
- if (!self._isDisabledDatepicker( inst.inline ? inst.dpDiv.parent()[0] : inst.input[0])) {
- $(this).parents('.ui-datepicker-calendar').find('a').removeClass('ui-state-hover');
- $(this).addClass('ui-state-hover');
- if(this.className.indexOf('ui-datepicker-prev') != -1) $(this).addClass('ui-datepicker-prev-hover');
- if(this.className.indexOf('ui-datepicker-next') != -1) $(this).addClass('ui-datepicker-next-hover');
- }
- })
- .end()
- .find('.' + this._dayOverClass + ' a')
- .trigger('mouseover')
- .end();
+ inst.dpDiv.find('.' + this._dayOverClass + ' a').mouseover();
var numMonths = this._getNumberOfMonths(inst);
var cols = numMonths[1];
var width = 17;
@@ -1715,6 +1700,28 @@ $.extend(Datepicker.prototype, {
}
});
+/*
+ * Bind hover events for datepicker elements.
+ * Done via delegate so the binding only occurs once in the lifetime of the parent div.
+ * Global instActive, set by _updateDatepicker allows the handlers to find their way back to the active picker.
+ */
+function bindHover(dpDiv) {
+ var selector = 'button, .ui-datepicker-prev, .ui-datepicker-next, .ui-datepicker-calendar td a';
+ return dpDiv.delegate(selector, 'mouseout', function() {
+ $(this).removeClass('ui-state-hover');
+ if (this.className.indexOf('ui-datepicker-prev') != -1) $(this).removeClass('ui-datepicker-prev-hover');
+ if (this.className.indexOf('ui-datepicker-next') != -1) $(this).removeClass('ui-datepicker-next-hover');
+ })
+ .delegate(selector, 'mouseover', function(){
+ if (!$.datepicker._isDisabledDatepicker( instActive.inline ? dpDiv.parent()[0] : instActive.input[0])) {
+ $(this).parents('.ui-datepicker-calendar').find('a').removeClass('ui-state-hover');
+ $(this).addClass('ui-state-hover');
+ if (this.className.indexOf('ui-datepicker-prev') != -1) $(this).addClass('ui-datepicker-prev-hover');
+ if (this.className.indexOf('ui-datepicker-next') != -1) $(this).addClass('ui-datepicker-next-hover');
+ }
+ });
+}
+
/* jQuery extend now ignores nulls! */
function extendRemove(target, props) {
$.extend(target, props);

0 comments on commit 0da176b

Please sign in to comment.