EXTJs Add items to panel from dynamic array

Question

I have an accordion layout which has 3 panel sections within it.

I want to use one of the sections to displays the months for the past 90 days. This can be between 3-5 months. I have a function that calculates these months and stores them in an array similar to:

months["May", "June, "July", "August"]

Based on the values in this array, I want these to display as links in the accordion panel. I have no idea how to dynamically add these as items to the accordion section. The links will be used to load grids into the Container of the overall border layout.

This is my accordion setup:

title        : 'Navigation',
              region       : 'west',
              collapsible  : false,           
              margins: '100 0 0 0',
              cmargins: '5 5 0 0',
               width: 175,
               minSize: 100,
               maxSize: 150,
               layout: {
                   type: 'accordion',
                   animate: true
               },
               items:[{ 
                        id:'main' 
                        ,title:'Summary'                        
                        ,collapsed:false
                        ,frame:true 
                        //captures the expand function to call the getgrids functionality
                        //don't want it to expand as it only displays 1 thing
                        ,expand : function(){                           
                            getGrids();
                        }
                    },
                    { 
                        id:'month' 
                        ,title:'Month View'                     
                        ,collapsed:false
                        ,frame:true
                        ,items:[{

                        }]
                    },{ 
                        id:'search' 
                        ,title:'Search' 
                        ,html: 'Search'
                        ,collapsed:true
                        ,frame:true                     
                    }]           
            },

Molecular Man · Accepted Answer · 2011-08-29 10:42:23Z

2

Are you sure you want add links as an items? There is no built-in link widget (at least I haven't heard of any). But add method and items config ARE for widgets. So if you would like to define your own link-widget you would be able to add it using such code:

var monthsWidget = Ext.getCmp('month');
for (var i = 0; i < months.length; i++)
  monthsWidget.add(new YourLinkWidget(/*config*/));

But creating new widget? ... for link? ... doesn't make sense to me. Why just not appending DOM elements to Ext.getCmp('month').body:

var monthsWidget = Ext.getCmp('month');
for (var i = 0; i < months.length; i++) {
  var link = Ext.createDom({
    tag: 'a',
    href: 'http://example.com'
  });

  Ext.fly(link).on('click', function(e) {
    // click handling here

    return false;
  });

  monthsWidget.body.appendChild(link);
}

answered Aug 29, 2011 at 10:42

Molecular Man

22.4k3 gold badges74 silver badges90 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

EXTJs Add items to panel from dynamic array

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related