Slider: factorize code with Widget method call. Fixed #8772 - Wrong slider UI state when disabled at init

This commit is contained in:
Samuel Bovée 2012-11-16 12:47:22 +01:00 committed by Mike Sherov
parent f13b5dfa7f
commit cb748b4a6f
2 changed files with 7 additions and 9 deletions

View File

@ -41,10 +41,10 @@ test("enable", function() {
equal(actual, expected, 'enable is chainable'); equal(actual, expected, 'enable is chainable');
el = $('<div></div>').slider({ disabled: true }); el = $('<div></div>').slider({ disabled: true });
ok(el.hasClass('ui-disabled'), 'slider has ui-disabled class before enable method call'); ok(el.hasClass('ui-state-disabled'), 'slider has ui-state-disabled class before enable method call');
ok(el.hasClass('ui-slider-disabled'), 'slider has ui-slider-disabled class before enable method call'); ok(el.hasClass('ui-slider-disabled'), 'slider has ui-slider-disabled class before enable method call');
el.slider('enable'); el.slider('enable');
ok(!el.hasClass('ui-disabled'), 'slider does not have ui-disabled class after enable method call'); ok(!el.hasClass('ui-state-disabled'), 'slider does not have ui-state-disabled class after enable method call');
ok(!el.hasClass('ui-slider-disabled'), 'slider does not have ui-slider-disabled class after enable method call'); ok(!el.hasClass('ui-slider-disabled'), 'slider does not have ui-slider-disabled class after enable method call');
}); });
@ -56,10 +56,10 @@ test("disable", function() {
equal(actual, expected, 'disable is chainable'); equal(actual, expected, 'disable is chainable');
el = $('<div></div>').slider({ disabled: false }); el = $('<div></div>').slider({ disabled: false });
ok(!el.hasClass('ui-disabled'), 'slider does not have ui-disabled class before disabled method call'); ok(!el.hasClass('ui-state-disabled'), 'slider does not have ui-state-disabled class before disabled method call');
ok(!el.hasClass('ui-slider-disabled'), 'slider does not have ui-slider-disabled class before disable method call'); ok(!el.hasClass('ui-slider-disabled'), 'slider does not have ui-slider-disabled class before disable method call');
el.slider('disable'); el.slider('disable');
ok(el.hasClass('ui-disabled'), 'slider has ui-disabled class after disable method call'); ok(el.hasClass('ui-state-disabled'), 'slider has ui-state-disabled class after disable method call');
ok(el.hasClass('ui-slider-disabled'), 'slider has ui-slider-disabled class after disable method call'); ok(el.hasClass('ui-slider-disabled'), 'slider has ui-slider-disabled class after disable method call');
}); });

View File

@ -54,8 +54,7 @@ $.widget( "ui.slider", $.ui.mouse, {
" ui-slider-" + this.orientation + " ui-slider-" + this.orientation +
" ui-widget" + " ui-widget" +
" ui-widget-content" + " ui-widget-content" +
" ui-corner-all" + " ui-corner-all");
( o.disabled ? " ui-slider-disabled ui-disabled" : "" ) );
this.range = $([]); this.range = $([]);
@ -116,6 +115,8 @@ $.widget( "ui.slider", $.ui.mouse, {
$( this ).data( "ui-slider-handle-index", i ); $( this ).data( "ui-slider-handle-index", i );
}); });
this._setOption( "disabled", o.disabled );
this._on( this.handles, { this._on( this.handles, {
keydown: function( event ) { keydown: function( event ) {
var allowed, curVal, newVal, step, var allowed, curVal, newVal, step,
@ -205,7 +206,6 @@ $.widget( "ui.slider", $.ui.mouse, {
.removeClass( "ui-slider" + .removeClass( "ui-slider" +
" ui-slider-horizontal" + " ui-slider-horizontal" +
" ui-slider-vertical" + " ui-slider-vertical" +
" ui-slider-disabled" +
" ui-widget" + " ui-widget" +
" ui-widget-content" + " ui-widget-content" +
" ui-corner-all" ); " ui-corner-all" );
@ -480,10 +480,8 @@ $.widget( "ui.slider", $.ui.mouse, {
this.handles.filter( ".ui-state-focus" ).blur(); this.handles.filter( ".ui-state-focus" ).blur();
this.handles.removeClass( "ui-state-hover" ); this.handles.removeClass( "ui-state-hover" );
this.handles.prop( "disabled", true ); this.handles.prop( "disabled", true );
this.element.addClass( "ui-disabled" );
} else { } else {
this.handles.prop( "disabled", false ); this.handles.prop( "disabled", false );
this.element.removeClass( "ui-disabled" );
} }
break; break;
case "orientation": case "orientation":