render container in the cell of grid.Panel

[kalachevmax]

Hi all!

I have the following scheme:



NewsBlockContainer

NewsBlockList

NewsItem
NewsItem
...





NewsBlockContainer is a Panel,
NewsBlockList is a grid.Panel,
NewsItem is a Container



Ext.define('myapp.view.NewsBlockContainer', {
extend: 'Ext.Panel',
alias: 'widget.newsblockcontainer',
xtype: 'newsblockcontainer',

items: [{
xtype: 'container',
items: [{
html: "<p>News items</p>"
}]
}, {
xtype:'newsitemslist'
}]
});




Ext.define('myapp.view.NewsItemsList', {
extend: 'Ext.grid.Panel',
alias: 'widget.newsitemslist',
xtype: 'newsitemslist',

columns:[{
flex: 1,
xtype: 'newsitem'
}]
});




Ext.define('myapp.view.NewsItem', {
extend: 'Ext.grid.column.Column',
alias: 'widget.newsitem',
xtype: 'newsitem',

layout: {
type: 'table',
columns: 4
},

items: [{
xtype:'headerblock',
colspan: 4,
}, {
xtype:'mainpartblock',
colspan: 4
}]
});


But this code does not work...



item.titleContainer is undefined
item.titleContainer.setStyle({



Can anyone explain me, why?

[vietits]

Ext.define('myapp.view.NewsItem', {
extend: 'Ext.grid.column.Column',
alias: 'widget.newsitem',
xtype: 'newsitem',

layout: {
type: 'table',
columns: 4
},

items: [{
xtype:'headerblock',
colspan: 4,
}, {
xtype:'mainpartblock',
colspan: 4
}]
});

Ext.grid.column.Column uses 'items' internally for sub-headers so you should not use it in defining grid column.

[kalachevmax]

Thanks for the reply, vietits.
Now i understand.

But, how can I insert container into grid.Panel's column?
I mean, that myapp.view.NewsItem extends from Ext.grid.column.Column now, and i want to extend from Ext.Container:



Ext.define('myapp.view.NewsItem', {
extend: 'Ext.Container',
alias: 'widget.newsitem',
xtype: 'newsitem',
layout: {
type: 'table',
columns: 4
},
items: [{
xtype: 'headerblock',
colspan: 4,
}, {
xtype: 'mainpartblock',
colspan: 4
}]
});




item.titleContainer is undefined
width = header.getDesiredWidth();
header.getDesiredWidth is not a function
width = header.getDesiredWidth();
header.getDesiredWidth is not a function
width = header.getDesiredWidth();

[vietits]

Have a look at my component: Its.grid.column.Component (http://www.sencha.com/forum/showthread.php?174504-Its.grid.column.Component-Component-Column-for-Ext-4.0.7). It allows you embed components in grid cells.

[kalachevmax]

Thank you very much, Vietits!
It works :)