Created
September 18, 2012 20:30
-
-
Save tlack/3745667 to your computer and use it in GitHub Desktop.
possible bug in jquery ui's slider class and closestHandle? Cannot call method 'addClass' of undefined
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
_mouseCapture: function( event ) { | |
var o = this.options, | |
position, | |
normValue, | |
distance, | |
closestHandle, | |
self, | |
index, | |
allowed, | |
offset, | |
mouseOverHandle; | |
if ( o.disabled ) { | |
return false; | |
} | |
this.elementSize = { | |
width: this.element.outerWidth(), | |
height: this.element.outerHeight() | |
}; | |
this.elementOffset = this.element.offset(); | |
position = { x: event.pageX, y: event.pageY }; | |
normValue = this._normValueFromMouse( position ); | |
distance = this._valueMax() - this._valueMin() + 1; | |
self = this; | |
this.handles.each(function( i ) { | |
var thisDistance = Math.abs( normValue - self.values(i) ); | |
if ( distance > thisDistance ) { | |
distance = thisDistance; | |
closestHandle = $( this ); | |
index = i; | |
} | |
}); | |
// workaround for bug #3736 (if both handles of a range are at 0, | |
// the first is always used as the one with least distance, | |
// and moving it is obviously prevented by preventing negative ranges) | |
if( o.range === true && this.values(1) === o.min ) { | |
index += 1; | |
closestHandle = $( this.handles[index] ); | |
} | |
// --- >8 --- >8 --- >8 --- >8 --- | |
// | |
// HERE'S MY FIX, FROM @TLACK | |
// fell through all other attempts? find at least the first | |
// handle.. | |
if (!closestHandle) { | |
index = 0; | |
closestHandle = $( this.handles[index] ); | |
} | |
// | |
// --- >8 --- >8 --- >8 --- >8 --- | |
allowed = this._start( event, index ); | |
if ( allowed === false ) { | |
return false; | |
} | |
this._mouseSliding = true; | |
self._handleIndex = index; | |
closestHandle | |
.addClass( "ui-state-active" ) | |
.focus(); | |
offset = closestHandle.offset(); | |
mouseOverHandle = !$( event.target ).parents().andSelf().is( ".ui-slider-handle" ); | |
this._clickOffset = mouseOverHandle ? { left: 0, top: 0 } : { | |
left: event.pageX - offset.left - ( closestHandle.width() / 2 ), | |
top: event.pageY - offset.top - | |
( closestHandle.height() / 2 ) - | |
( parseInt( closestHandle.css("borderTopWidth"), 10 ) || 0 ) - | |
( parseInt( closestHandle.css("borderBottomWidth"), 10 ) || 0) + | |
( parseInt( closestHandle.css("marginTop"), 10 ) || 0) | |
}; | |
if ( !this.handles.hasClass( "ui-state-hover" ) ) { | |
this._slide( event, index, normValue ); | |
} | |
this._animateOff = true; | |
return true; | |
}, |
I made below changes to jquery-ui.js file and that fixed my issue and everything is working smoothly.
this.handles.each(function(i) {
var thisDistance = Math.abs(normValue - that.values(i));
if (!thisDistance)
thisDistance = 0;
if ((distance > thisDistance) ||
(distance === thisDistance &&
(i === that._lastChangedValue || that.values(i) === o.min))) {
distance = thisDistance;
closestHandle = $(this);
index = i;
}
});
if (o.range === true && this.values(1) === o.min) {
index += 1;
closestHandle = $(this.handles[index]);
}
allowed = this._start(event, index);
if (allowed === false) {
return false;
}
this._mouseSliding = true;
this._handleIndex = index;
closestHandle
.addClass("ui-state-active")
.focus();
Do you have some decimal values like .5 in your min, max, value value?
Once I changed it to 0.5, it worked
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Is there a fix for this?