Thank you for reporting this bug. We will make it our priority to review this report.
  1. 13 Aug 2010 3:27 PM #1
    mitch_feaster
    mitch_feaster is offline
    Ext User mitch_feaster's Avatar
    Join Date
    Feb 2009
    Posts
    33
    Vote Rating
    0
    mitch_feaster is on a distinguished road
      0  

    Default [DEFER-1207] Slider in panel with collapsed:true make slider weird

    [DEFER-1207] Slider in panel with collapsed:true make slider weird


    Ext version tested:
    • Ext 3.2.1

    Adapter used:
    • ext

    css used:
    • only default ext-all.css



    Browser versions tested against:
    • Chrome
    • FF3 (firebug 1.5.4 installed)

    Operating System:
    • Linux (Ubuntu 10.04)

    Description:
    • When an Ext.Slider is placed in a panel which has config collapsed:true the slider handles get goofed up. With just one handle the 0 value becomes slightly offset. With two handles they each start at the same position (at the same place as when there's just one handle) and when you move one the other tries to move itself over to the other one. Similarly for three...

    Test Case:

    Code:
    <html>
<head>
  <link rel="stylesheet" href="http://extjs-public.googlecode.com/svn/tags/extjs-3.2.1/release/resources/css/ext-all.css" type="text/css" media="screen" />
  <script type="text/javascript" src="http://extjs-public.googlecode.com/svn/tags/extjs-3.2.1/release/adapter/ext/ext-base-debug.js"></script>
  <script type="text/javascript" src="http://extjs-public.googlecode.com/svn/tags/extjs-3.2.1/release/ext-all-debug.js"></script>

  <script type="text/javascript">
Ext.ns('bug');

bug.zoom_top = 100;
bug.zoom_bottom = 0;

// zoom slider:
bug.zoom_slider = new Ext.Slider({
    fieldLabel: 'Zoom Level'
    ,width: 300
    ,increment: 1
    ,minValue: 0
    ,maxValue: 100
    ,values: [0, 100]
});

bug.mypanel = new Ext.Panel({
    title: 'Some Controls'
    ,height: 'auto'
    ,frame: true
    ,items: new Ext.form.FormPanel({
	width: 600
	,items: [{
	    xtype: 'fieldset'
	    ,title: 'Range Controls'
	    ,collapsible: true
	    ,collapsed: true
	    ,items: [{
		xtype: 'fieldset'
		,title: 'Zoom in Even Further'
		,items: bug.zoom_slider
	    }]
	}]
    })
});


Ext.onReady(function() {
    bug.mypanel.render('panel-area');
});

  </script>

</head>
<body>

  hello, world

  <div id="panel-area"></div>

</body>
</html>
    Copy/paste the code into an html file and open it.


    Steps to reproduce the problem:
    • Load the page
    • Expand the panel
    • Behold the goofiness
    • Slide the handles a bit to observe the goofiness

    The result that was expected:
    • Handles load in the correct place
    • Slide the handles around naturally

    The result that occurs instead:
    • Handles load in a weird place
    • The handles try to lay on top of each other

    Screenshot:
    • attached

    Debugging already done:
    • Confirmed that configuring the panel with collapsed:true produces the bug, but collapsed:false is normal.

    Possible fix:
    • not provided
    Attached Images
    Reply With Quote Reply With Quote
  2. 16 Aug 2010 9:59 AM #2
    Jamie Avins
    Jamie Avins is offline
    Sencha - Sencha Touch Dev Team Jamie Avins's Avatar
    Join Date
    Mar 2007
    Location
    Redwood City, California
    Posts
    3,652
    Vote Rating
    14
    Jamie Avins is a jewel in the rough Jamie Avins is a jewel in the rough Jamie Avins is a jewel in the rough
      0  

    Default


    Thank you for the report.
    Reply With Quote Reply With Quote
  3. 19 Sep 2010 11:48 PM #3
    evant
    evant is online now
    Sencha - Ext JS Dev Team evant's Avatar
    Join Date
    Apr 2007
    Location
    Sydney, Australia
    Posts
    15,079
    Vote Rating
    97
    evant is a splendid one to behold evant is a splendid one to behold evant is a splendid one to behold evant is a splendid one to behold evant is a splendid one to behold evant is a splendid one to behold evant is a splendid one to behold
      0  

    Default


    Will be a bit difficult to solve now, probably something we'll target for 4.x. In the interim, you can use hideMode: 'offsets' on the fieldset to work around this behaviour.
    Evan Trimboli
    Sencha Developer
    Twitter - @evantrimboli
    Don't be afraid of the source code!
    Reply With Quote Reply With Quote

Similar Threads

  1. [3.2] Ext.ux.slider.Highlight - A slider background color plugin
    By mankz in forum Ext 3.x: User Extensions and Plugins
    Replies: 8
    Last Post: 8 Feb 2012, 5:03 AM
  2. Ext.Slider - Changing the range of an existing slider
    By srininara in forum Ext 2.x: Help & Discussion
    Replies: 1
    Last Post: 24 Jun 2009, 3:49 AM
  3. [FIXED][3.0rc1.1] Weird behavior of Slider on IE
    By elwhiz in forum Ext 3.x: Bugs
    Replies: 7
    Last Post: 21 Jun 2009, 10:27 PM