Results 1 to 3 of 3

Thread: Sliders thumbs not positioned properly in hidden tabs

    Thank you for reporting this bug. We will make it our priority to review this report.
  1. #1
    Sencha User
    Join Date
    Jun 2007
    Posts
    44
    Vote Rating
    0
      0  

    Default Sliders thumbs not positioned properly in hidden tabs

    REQUIRED INFORMATION


    Ext version tested:
    • Ext 4.07


    Browser versions tested against:
    • Firefox 8

    Description:
    • Sliders do not consistently display the correct thumb position when there are several of them and they are being changed problematically while on a tab which is not visible.


    Steps to reproduce the problem:
    • Define multiple tabs with several sliders on each
    • Disable & enable the slides, change the values of the thumbs on all the sliders while they aren't visible.
    • Switch tabs to see the thumbs in the wrong position (while getValue() returns the correct value)


    The result that was expected:
    • The thumbs should be at the slider getValue() position.


    The result that occurs instead:
    • Thumbs are all the way to the left/bottom.


    Test Case:

    (Too complex to provide.)


    HELPFUL INFORMATION

    Debugging already done:
    • There is no obvious coding issue. It may be related to what happens to the thumb animation when a slider is disabled and re-enabled while on a non-visible tab. But the problem is not consistent.


    Possible fix:
    • The problem can be fixed by synchronizing the thumbs when a tab is displayed. This should obviously be handled by the slider itself.

    Code:
        slider.on('afterrender', function () {
          var tabPanel = this.findParentBy(function (container, component) { return container instanceof Ext.tab.Panel; });
          if ( null !== tabPanel ) tabPanel.on('tabchange', function () { this.syncThumbs(); }, this);
        });

  2. #2
    Sencha Premium User mitchellsimoens's Avatar
    Join Date
    Mar 2007
    Location
    Gainesville, FL
    Posts
    40,385
    Vote Rating
    1540
      0  

    Default

    Can I get a locally runnable test case?
    Mitchell Simoens @LikelyMitch
    Modus Create, Senior Frontend Engineer
    ________________
    Need any sort of Ext JS help? Modus Create is here to help!

    Check out my GitHub:
    https://github.com/mitchellsimoens

  3. #3
    Sencha User
    Join Date
    Jun 2007
    Posts
    44
    Vote Rating
    0
      0  

    Default

    I'd love to provide one, but I just don't have the resources to do so. Plus, since it was inconsistent, I suspect that it might be a browser bug or some other flaw that you wouldn't see anyway, and I don't want to waste time making something that won't even show the problem.

    All I can do is assure you that those lines (or rather, ones similar to them, structured to fit into a subclass of a 'Single' slider) fix the problem.

    I looked for some kind of event that the slider is supposed to get when it is tab-exposed, but there doesn't seem to be such a thing. I don't know why the sliders aren't moving when they're not visible; but I am guessing that somewhere in the animation logic it's asking the browser for information about where the thumb is, and since it's not visible, it's getting answers that result in it not moving. But I can't guess why it'd only happen sometimes -- maybe it has to do with the relative z-order of the thumbs and tabs -- I have pages of tabs-of-tabs-of-tabs, with lots of sliders, so... there's a lot there. It might not even happen in a small test case.

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •