Ext.container.Container and data property

[gianmario]

Hi everybody,


maybe my problem have a simple solution that I don't saw it yet.


I have a Container on which I have defined data property:


data: { nome: 'home', titolo_finestra: 'Lista Persone' }


I wish to access to container's data property at run time to get data stored. Anybody can show me how?


I don't have found any method to accomplish this nor data property is present in container object (trying to access it from javascript console)


thanks in advance

[slemmon]

You should be able to access it using any reference to that container:

var ct = Ext.create('Ext.container.Container', {
    width: 400,
    height: 100,
    renderTo: Ext.getBody(),
    border: 1,
    style: {borderColor:'#000000', borderStyle:'solid', borderWidth:'1px'},
    data: { nome: 'home', titolo_finestra: 'Lista Persone' }
});


console.log(ct);
console.log(ct.data);

[gianmario]

Hi slemmon,

tnks for your answer. I've already tried what you have suggested me, but on run time seems it doesn't work. Maybe I do some mistake that I do not see.


I have a container with a series of others items (these have data property with something). they are containers also.

{
xtype: 'container',
id: 'breadcrumbid',

layout: {
type: 'hbox',
align: 'middle'
},

items: [
{
xtype: 'container',
title: 'Lista Aziende',
tpl: '> {nome}',
margin: '0 0 0 10',
data: { nome: 'home', titolo_finestra: 'Lista Aziende'}
}
]
}


In run time I want to access to one of "breadcrumbid" container's items. so I use this code (by chrome's javascript console):


Ext.ComponentQuery.query('#breadcrumbid')[0].items.items[0].title

give me back: "Lista Aziende", that it's correct, but if I use:

Ext.ComponentQuery.query('#breadcrumbid')[0].items.items[0].data

console give me back: undefined

I don't understand why


I searched in extjs docs but i don't found any possible explaination. I'm glad if you can give me one.

thanks anyway
gmario

[slemmon]

I see. Looks like the data property is consumed when applied to the template (tpl).

I'd do something like this I think - as a way to preserve the data config passed in.

Ext.define('Crumb', {
    extend: 'Ext.container.Container',
    alias: 'widget.crumb',
    initComponent: function () {
        this.initialDataConfig = Ext.apply({}, this.data);
        this.callParent(arguments);
    }
});


var ct = Ext.widget({
    xtype: 'container',
    renderTo: document.body,
    id: 'breadcrumbid2',


    layout: {
        type: 'hbox',
        align: 'middle'
    },


    items: [{
        xtype: 'crumb',
        title: 'Lista Aziende',
        tpl: '> {nome}',
        margin: '0 0 0 10',
        data: {
            nome: 'home',
            titolo_finestra: 'Lista Aziende'
        }
    }]
});




console.log(Ext.getCmp('breadcrumbid2').items.getAt(0).initialDataConfig);