View Full Version : Rowexpander Error

17 Jan 2013, 7:54 AM

in my application i have a window with a gridpanel inside, each row can open a popup window which contains another gridpanel.
In the "main" gridpanel there is the rowexpander plugin and it works properly, but when I try to add the rowexpander plugin in the detail window, I get this error:

TypeError: me.el is null in http://...../extjs/src/util/Renderable.js?_dc=1358435598747

The 2 gridpanels are configured in the same way... I post some code:

Main GridPanel -WORKS!!!

Ext.define('MyApp.view.mymodule.TktMainGrid', {
extend: 'Ext.grid.Panel',
alias: 'widget.myapp-tktmaingrid',id:'tktmaingrid',
viewConfig:{enableRowBody:true},forceFit: true,
defColumns: [] ,
plugins: [
{ptype: 'rowexpander',
rowBodyTpl : [
'<div class="tk-vo-1">RDI Num:</div>',
'<div class="tk-va-1">{TKID}</div>',
'<div class="tk-vo-2">Title:</div>',
'<div class="tk-va-2">{TITO}</div>',
'<div class="tk-vo-1">Dt Open:</div>',
'<div class="tk-va-1">{DTCR}</div>',
'<div class="tk-vo-2">Description:</div>',
'<div class="tk-va-2">{TDES}</div>'
{ptype: 'persfilters', module: 'modulo-ticket', phpFile: urlData,
srpan : 'tktsearchpanel'},
{ptype: 'perslayout', module: 'modulo-ticket', phpFile: urlData }
initComponent: function(){
var me = this,
aColumns = [
{text: 'Id', dataIndex:'TKID', width:45},
{text: "Weight", dataIndex:'SVDE', width:80},
{text: 'Title', dataIndex:'STAD'},
{text: 'State', dataIndex:'DTRI', width:70}
//------------------------------- COLUMNS ------------------------------
columns: aColumns
dockedItems : [
{xtype:'toolbar', dock:'top', items:[
{xtype : 'pagingtoolbar', pageSize: 5, store: 'Tickets',
dock : 'bottom', displayInfo : true,
displayMsg: 'Displaying topics {0} - {1} of {2}',
emptyMsg : 'No data to display'}

Detail GridPanel -doesn't work

requires: ['Myapp.ux.RowExpander'],
extend: 'Ext.grid.Panel',
alias: 'widget.smqs-tktschedap5', title: 'Details',layout:'fit',
store: 'TktOldtickets',
viewConfig:{forceFit: true,enableRowBody:true},
plugins: [{
ptype: 'rowexpander',
rowBodyTpl : [
'<div class="tk-vo-1">RDI:</div>',
'<div class="tk-va-1">{TKID}</div>',
'<div class="tk-vo-2">Titl3:</div>',
'<div class="tk-va-2">{TITO}</div>',
'<div class="tk-vo-1">Dt Open:</div>',
'<div class="tk-va-1">{DTCR}</div>',
'<div class="tk-vo-2">Descr.</div>',
'<div class="tk-va-2">{TKDE}</div>'
pluginId: 'otRowExpander'
initComponent: function(){
var me = this;
Ext.apply(this, {
columns: [
dockedItems : [{
xtype : 'pagingtoolbar',
pageSize : 5,
store : 'TktModifiche',
dock : 'bottom',
displayInfo : true,
displayMsg: 'Visualizza record {0} - {1} of {2}',
emptyMsg : 'No data to display',

There are defined in the same way, why the error?

Thanks in advance

21 Jan 2013, 11:05 AM
They are a little different, first thing I see is you have layout : 'fit' on the broken grid, would remove that first.

1 Mar 2013, 12:36 AM

I haven't replied before cause I had to go on the project.

I have applied your advice and remove
layout:'fit' from the code
and I force the 2 grids to have the same configuration,
but nothing has changed, I continue to get the same error:

TypeError: me.el is null ...extjs/src/util/Renderable.js?_dc=1362125916796

Any idea?