diff --git a/tests/unit/slider/methods.js b/tests/unit/slider/methods.js
index 5c0cbb7bd3e..d5c7dd95c82 100644
--- a/tests/unit/slider/methods.js
+++ b/tests/unit/slider/methods.js
@@ -161,4 +161,53 @@ test( "values, multi step", function() {
element.slider( "destroy" );
} );
+test( "values", function() {
+ expect( 12 );
+
+ var element = $( "" ).slider( {
+ range: true,
+ min: 10,
+ max: 100,
+ step: 1
+ } );
+
+ element.slider( "values", [ 20, 90 ] );
+ deepEqual( element.slider( "values" ), [ 20, 90 ], "Values (array) - get value for all handles" );
+
+ element.slider( "values", [ 0, 200 ] );
+ deepEqual( element.slider( "values" ), [ 10, 100 ], "Values (array) - restricted min and max" );
+
+ element.slider( "values", 0, 50 );
+ equal( element.slider( "values", 0 ), 50, "Values (index,value) - set first handle" );
+
+ element.slider( "values", 1, 75 );
+ equal( element.slider( "values", 1 ), 75, "Values (index,value) - set second handle" );
+
+ element.slider( "values", 0, 5 );
+ equal( element.slider( "values", 0 ), 10, "Values (index,value) - 1st handle restricted properly, against min" );
+
+ element.slider( "values", 0, 90 );
+ equal( element.slider( "values", 0 ), element.slider( "values", 1 ), "Values (index,value) - 1st handle restricted properly, against 2nd handle" );
+
+ element.slider( "values", 1, 110 );
+ equal( element.slider( "values", 1 ), 100, "Values (index,value) - 2nd handle restricted properly, against max" );
+
+ element.slider( "values", 1, 40 );
+ equal( element.slider( "values", 1 ), element.slider( "values", 0 ), "Values (index,value) - 2nd handle restricted properly, against 1st handle" );
+
+ element.slider( "values", [ 50, 75 ] );
+
+ element.slider( "values", [ 0, 75 ] );
+ deepEqual( element.slider( "values" ), [ 10, 75 ], "Values (array) - Setting both handles - against min" );
+
+ element.slider( "values", [ 0, 90 ] );
+ deepEqual( element.slider( "values" ), [ 10, 90 ], "Values (array) - 1st handle restricted properly, against 2nd handle" );
+
+ element.slider( "values", 1, 110 );
+ deepEqual( element.slider( "values" ), [ 10, 100 ], "Values (array) - 2nd handle restricted properly, against max" );
+
+ element.slider( "values", [ 75, 50 ] );
+ deepEqual( element.slider( "values" ), [ 75, 75 ], "Values (array) - Setting both handles - 2nd Handle resets to 1st" );
+} );
+
} );
diff --git a/tests/unit/slider/options.js b/tests/unit/slider/options.js
index 031031cdc81..4e7bae97c1d 100644
--- a/tests/unit/slider/options.js
+++ b/tests/unit/slider/options.js
@@ -238,18 +238,34 @@ test( "step", function() {
//});
test( "values", function() {
- expect( 2 );
+ expect( 6 );
// Testing multiple ranges on the same page, the object reference to the values
// property is preserved via multiple range elements, so updating options.values
// of 1 slider updates options.values of all the others
+
var ranges = $( [
- document.createElement( "div" ),
- document.createElement( "div" )
- ] ).slider( {
- range: true,
- values: [ 25, 75 ]
- } );
+ document.createElement( "div" ),
+ document.createElement( "div" )
+ ] ).slider( {
+ range: true,
+ values: [ 25, 75 ]
+ } ),
+ element = $( "" ).slider( {
+ range: true,
+ min: 10,
+ max: 100,
+ step: 1,
+ values: [ 15, 1 ]
+ } );
+
+ ranges = $( [
+ document.createElement( "div" ),
+ document.createElement( "div" )
+ ] ).slider( {
+ range: true,
+ values: [ 25, 75 ]
+ } );
notStrictEqual(
ranges.eq( 0 ).slider( "instance" ).options.values,
@@ -264,11 +280,24 @@ test( "values", function() {
ranges.eq( 1 ).slider( "values", 0 ),
"the values for multiple sliders should be different"
);
+
+ deepEqual( element.slider( "values" ), [ 15, 15 ], "handles restricted properly when set programmatically - 2nd handle reset" );
+
+ element.slider( "option", "values", [ 0, 200 ] );
+ deepEqual( element.slider( "values" ), [ 10, 100 ], "option values - restricted min and max" );
+
+ element.slider( "option", "values", [ 15, 1 ] );
+ deepEqual( element.slider( "values" ), [ 15, 15 ], "option values - restricted 2nd Handle" );
+
+ element.slider( "option", "values", [ 15, 15 ] );
+ element.slider( "option", "values", [ 25, 15 ] );
+ deepEqual( element.slider( "values" ), [ 25, 25 ], "option values - restricted 2nd Handle" );
+
} );
test( "range", function( assert ) {
expect( 32 );
- var range;
+ var element,range;
// Min
element = $( "" ).slider( {
diff --git a/ui/widgets/slider.js b/ui/widgets/slider.js
index 8b8a7292af7..5f30bdfe32a 100644
--- a/ui/widgets/slider.js
+++ b/ui/widgets/slider.js
@@ -76,6 +76,7 @@ return $.widget( "ui.slider", $.ui.mouse, {
this._detectOrientation();
this._mouseInit();
this._calculateNewMax();
+ this._cleanValues();
this._addClass( "ui-slider ui-slider-" + this.orientation,
"ui-widget ui-widget-content" );
@@ -160,6 +161,41 @@ return $.widget( "ui.slider", $.ui.mouse, {
}
},
+ _cleanValues: function( index, newValue ) {
+ var values;
+
+ if ( this.options.range === true ) {
+ if ( arguments.length === 2 ) {
+ values = this.options.values;
+ if ( index === 0 && newValue > values[ 1 ] ) {
+ newValue = values[ 1 ];
+ }else if ( index === 1 && newValue < values[ 0 ] ) {
+ newValue = values[ 0 ];
+ }
+ return newValue;
+ }
+
+ values = arguments[ 0 ] || this.options.values;
+ if ( values ) {
+ if ( values[ 0 ] > values[ 1 ] ) {
+ values[ 1 ] = values[ 0 ];
+ }
+
+ if ( !arguments.length ) {
+ this.options.values = values;
+ }
+
+ return values;
+ }
+ } else {
+ if ( $.isArray( arguments[ 0 ] ) ) {
+ return arguments[ 0 ];
+ } else {
+ return newValue;
+ }
+ }
+ },
+
_setupEvents: function() {
this._off( this.handles );
this._on( this.handles, this._handleEvents );
@@ -385,6 +421,7 @@ return $.widget( "ui.slider", $.ui.mouse, {
if ( arguments.length > 1 ) {
this.options.values[ index ] = this._trimAlignValue( newValue );
+ this.options.values[ index ] = this._cleanValues( index, newValue );
this._refreshValue();
this._change( null, index );
return;
@@ -393,7 +430,7 @@ return $.widget( "ui.slider", $.ui.mouse, {
if ( arguments.length ) {
if ( $.isArray( arguments[ 0 ] ) ) {
vals = this.options.values;
- newValues = arguments[ 0 ];
+ newValues = this._cleanValues( arguments[ 0 ] );
for ( i = 0; i < vals.length; i += 1 ) {
vals[ i ] = this._trimAlignValue( newValues[ i ] );
this._change( null, i );
@@ -452,6 +489,7 @@ return $.widget( "ui.slider", $.ui.mouse, {
break;
case "values":
this._animateOff = true;
+ this._cleanValues();
this._refreshValue();
// Start from the last handle to prevent unreachable handles (#9046)