Looks like we can't reproduce the issue or there's a problem in the test case provided.
  1. #1
    Sencha User
    Join Date
    Jul 2012
    Location
    Italy
    Posts
    84
    Vote Rating
    4
    Tegola is on a distinguished road

      0  

    Default "scrollDocked" items inside a list will render inside the first list item

    "scrollDocked" items inside a list will render inside the first list item


    As the subject says.
    A docked item should be rendered outside the first item.

    Test case here:
    http://new.senchafiddle.com/#/l3e2N/

  2. #2
    Sencha - Senior Forum Manager mitchellsimoens's Avatar
    Join Date
    Mar 2007
    Location
    Gainesville, FL
    Posts
    37,533
    Vote Rating
    871
    mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute

      0  

    Default


    This is expected behavior and not a bug.
    Mitchell Simoens @SenchaMitch
    Sencha Inc, Senior Forum Manager
    ________________
    Check out my GitHub, lots of nice things for Ext JS 4 and Sencha Touch 2
    https://github.com/mitchellsimoens

    Think my support is good? Get more personalized support via a support subscription. https://www.sencha.com/store/

    Need more help with your app? Hire Sencha Services services@sencha.com

    Want to learn Sencha Touch 2? Check out Sencha Touch in Action that is in print!

    When posting code, please use BBCode's CODE tags.

  3. #3
    Sencha User
    Join Date
    Jul 2012
    Location
    Italy
    Posts
    84
    Vote Rating
    4
    Tegola is on a distinguished road

      1  

    Default


    So what's the best way to add an element at the beginning of a grouped list and make it scroll with it?

  4. #4
    Sencha Premium Member
    Join Date
    May 2012
    Posts
    9
    Vote Rating
    1
    jensenl is on a distinguished road

      1  

    Default


    You guys are aware that this produces some odd side effects, right?

    Such as, it is hard to get a disclosure icon to align correctly in the first list item when the scrollDocked items are added to it, the scrollDocked items get (visually) selected along with the first list item, the scrollDocked items do not show up if the list is empty, and there is no ability to have multiple lists stacked vertically in a view without setting a fixed height.

    I'm sure that one can find work-arounds for most of this but it starts to feel like you are fighting against Sencha Touch rather than being enabled by it.

    EDIT: One other oddity to add, the list group header for the first list item shows up above scrollDocked items.

  5. #5
    Sencha User
    Join Date
    Jul 2012
    Location
    Italy
    Posts
    84
    Vote Rating
    4
    Tegola is on a distinguished road

      0  

    Default


    Quote Originally Posted by jensenl View Post
    EDIT: One other oddity to add, the list group header for the first list item shows up above scrollDocked items.
    That's what I've started this thread for, but you added some good points.

  6. #6
    Sencha User
    Join Date
    Jul 2012
    Location
    Italy
    Posts
    84
    Vote Rating
    4
    Tegola is on a distinguished road

      0  

    Default


    I haven't tested it yet, but seems that this has been fixed in Touch 2.2.0 beta 1, as stated by the release notes:
    http://cdn.sencha.com/touch/sencha-t...ase-notes.html
    Updated List to have headers not be nested inside the ListItem
    While I'm happy it has been fixed, I have to say that the way submitted bugs are managed is very questionable.

    Anyway, thanks to the Sencha team.

  7. #7
    Sencha User
    Join Date
    Feb 2011
    Posts
    57
    Vote Rating
    2
    Hertz is on a distinguished road

      1  

    Default


    I'm having the same issue and I don't think this should be the normal behavior as mitchellsimoens mentions.

    I'm using Sencha Touch 2.2 RC.

    In Sencha Touch 2.0.1 this scenario was handled correctly, since any item added to a list (via the items config property), was inserted outside the list items.

    The scenario that I have is the following:

    The Main View needs to display a list of articles, which are grouped by Section, but inside this same view I need to display a Carousel at the top, which also contains articles but from a "featured" Section.
    The way the scrollDocked items are being inserted in Sencha Touch 2.2 RC doesn't allow me to do this.

    Sencha Fiddle Result:
    http://api.senchafiddle.com/v3/full/kC5vu/

    Code:
    Ext.Loader.setConfig({
        enabled : true
    });
    
    
    Ext.application({
        name : ('SF' || 'SenchaFiddle'),
        
        launch : function() {
            Ext.create('Ext.List', {
                fullscreen : true,
                grouped: true,
                scrollable: {
                    direction: 'vertical',
                    directionLock: true
                },
                items: [{
                    xtype: 'carousel',
                    scrollDock: 'top',
                    height: 300,
                    padding: 20,
                    items: [
                        { html: 'This is also an Article but it belongs to the Featured Section and it is presented in a Carousel</br></br>But the group header will confuse users, since it says Entertainment' },
                        { html: 'Another Article that belongs to the Featured Section and is presented in a Carousel' }
                    ],
                    style: 'background: green; border: 1px solid silver; color: white'
                }],
                store: {
                    grouper: 'group',
                    data: [
                        { text: 'Article 1', group: 'Sports' },
                        { text: 'Article 2', group: 'Sports' },
                        { text: 'Article 3', group: 'Entertainment' },
                        { text: 'Article 4', group: 'Entertainment' },
                        { text: 'Article 5', group: 'Entertainment' },
                        { text: 'Article 6', group: 'Entertainment' },
                        { text: 'Article 7', group: 'Fashion' },
                        { text: 'Article 8', group: 'Fashion' },
                        { text: 'Article 9', group: 'Fashion' },
                        { text: 'Article 10', group: 'Fashion' },
                        { text: 'Article 11', group: 'Fashion' },
                        { text: 'Article 12', group: 'Fashion' },
                        { text: 'Article 13', group: 'Fashion' },
                        { text: 'Article 14', group: 'Fashion' }
                    ]
                }
            });
        }
    });



    Technically it might not be a bug, but as others in the post have mentioned, this should not be the normal behavior.

    Is there any workaround for this?. How could I create an UI like the one I mention (the Carousel being outside of the list items)?.

  8. #8
    Sencha User
    Join Date
    May 2013
    Posts
    5
    Vote Rating
    1
    lellimecnar is on a distinguished road

      1  

    Default Re-Open

    Re-Open


    I'm sorry, but this is NOT expected behavior. If I want something docked to the top of my grouped list, I do NOT want it to be grouped in with the first group in my list. It should be placed above the first group header, not below it.