ExtJs - how to set id of component when using multiple instances

2
votes

I use ExtJs 4.1 and DeftJs.

When using multiple instances of the same views at the same time, there is a problem addressing a component given the id: 'abc' since all instances will have the same id.

So how do I name the ids to prevent this?

One option is to create the components dynamically.

Another option that I would prefer is calling an component by id only of a certain view, like:

this.getView.getComponent('x').getId('abc')

2
javascriptmodel-view-controllerextjs

2 Answers

3
votes

If you can set the parent element to a unique id, you can use the itemId property on child items. Example of this from sencha's documentation (taken from the link below it):

var c = new Ext.panel.Panel({ //
height: 300,
renderTo: document.body,
layout: 'auto',
items: [
    {
        itemId: 'p1',
        title: 'Panel 1',
        height: 150
    },
    {
        itemId: 'p2',
        title: 'Panel 2',
        height: 150
    }
]
})
p1 = c.getComponent('p1'); // not the same as Ext.getCmp()
p2 = p1.ownerCt.getComponent('p2'); // reference via a sibling

http://docs.sencha.com/ext-js/4-0/#!/api/Ext.AbstractComponent-cfg-itemId

0
votes

I try to avoid global ids and use this.getView().getComponent() from a controller to access my view. If necessary I additionally use a unique string in my id name.