Results 1 to 2 of 2

Thread: Is it possible to use different components as parts of a NestedList?

  1. #1

    Default Is it possible to use different components as parts of a NestedList?

    Hi,

    I'm trying to make a "drill down" navigation app, but I want to be able to show different components in every page. for example a carousel, and then below that, 3 or 4 options that will lead to different pages (just like the NestedList example works right now). Is that possible? I tried to put something like:

    Code:
        onReady: function() {
        
        var carousel1 = new Ext.Carousel({
               defaults: { cls: 'card' },
               items: [{
                  html: '<h1>Carousel</h1><p>Navigate the two carousels on this page by swiping left/right or clicking on one side of the circle indicators below.</p>'
              }, {
                  title: 'Tab 2',
                  html: '2'
              }, {
                  title: 'Tab 3',
                  html: '3'
              }]
            });
            
            
            var nestedList = new Ext.NestedList({
                fullscreen: true,          
                items: [carousel1, {
                    text: 'Option A',
                    items: [{
                        text: 'Option A.1',
                        customAttribute: 123,
                        items: [{
                            text: 'Option A.1.a'
                        },{
                            text: 'Option A.1.b'
                        }]
                    },{
                        text: 'Option A.2',
                        customAttribute: 389
                    }]
                },{
                    text: 'Option B',
                    items: [{
                        text: 'Option B.1',
                        customAttribute: 233
                    },{
                        text: 'Option B.2',
                        customAttribute: 2390
                    }]
                },{
                    text: 'Option C',
                    items: [{
                        text: 'Option C.1',
                        customAttribute: 903
                    },{
                        text: 'Option C.2',
                        customAttribute: 77
                    }]
                }]        
            });
    but the result is not rendering properly and the carousel does not behave as expected.
    Any help/ideas/suggestions?

    Thanks in advance,
    Irene

  2. #2
    Sencha User
    Join Date
    Mar 2007
    Location
    Haarlem, Netherlands
    Posts
    1,243

    Default

    Thanks for the suggestion. The NestedList component is not as flexible yet as it should be. We have some major improvements planned for it. The way you can work around it for now is by wrapping the NestedList in another panel with a card layout. Then you can switch between the NestedList and your Carousel by using the setCard method on the outer panel. Check the Kitchensink source code in which we do something very similar.

Similar Threads

  1. Contextmenu for all parts
    By Stephan123 in forum Ext 3.x: Help & Discussion
    Replies: 0
    Last Post: 25 Aug 2009, 12:03 AM
  2. Some parts are not loading correctly
    By wurstkuchen in forum Ext 2.x: Help & Discussion
    Replies: 12
    Last Post: 11 Oct 2008, 6:58 AM
  3. In IE , Problem the div be cut to many parts... Please Help...
    By suyuan in forum Ext 2.x: Help & Discussion
    Replies: 2
    Last Post: 13 Aug 2008, 7:51 PM
  4. "... is infamous around these parts...
    By askohen in forum Community Discussion
    Replies: 2
    Last Post: 7 Jul 2008, 10:32 AM
  5. What parts to load
    By kdnyegaard in forum Ext 1.x: Help & Discussion
    Replies: 1
    Last Post: 5 Aug 2007, 5:31 PM

Tags for this Thread

Posting Permissions

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