PDA

View Full Version : unable to make two instance of a custom panel



toxkillfraex
1 Mar 2012, 5:38 AM
I've looked all over google but it hasn't been very helpful >.>
that or I just am missing something here

anyway i have a certain panel with an accordion layout that is supposed to show (in long term) x amount of a certain custom panel I made. Instead it seem unable to show it even twice.

if I write:
var panel1 = Ext.create('App.view.custom', {
title: 'panel1'
})

var panel2 = Ext.create('App.view.custom', {
title: 'panel2'
})

and then

Ext.applyIf(this,
items:[panel1, panel2])

it will only show the second custom panel

if i just replace the items with item: [panel1] it will show the first panel with the right title even though I still make the second one...

so how am I overwriting here?

if I'm in the wrong place direct me to the right place.
if there's actually a proper explanation for what I'm doing wrong just link it.
if there's another question like this with a good answer give me the link.

I really narrowed it down to that there's nothing else in the classes that can cause what's happening.
it does work with two basic panels but that's normal

arthurakay
1 Mar 2012, 7:14 AM
If panel1 and panel2 are the child items of some component (a container?), you need to show the configuration of that parent component. I can't give you an answer without seeing that code.

If I had to guess, you're using the wrong layout and one of these child components is simply hidden.

toxkillfraex
1 Mar 2012, 7:53 AM
alright then
the container
Ext.define(App.view.accordionPane',
{
extend: 'Ext.panel.Panel',
layout: 'accordion',
requires: ['Ext.panel.Panel'],

initComponent: function()
{
var me = this;

var drawer = Ext.create('App.view.Custom',
{
title: 'the first one'
});

var drawer2 = Ext.create('App.view.Custom',
{
title: 'something else'
});

Ext.applyIf(me,
{
items: [drawer, drawer2]
})

me.callParent();
}
});

and the other one

Ext.define('App.view.Custom',
{
id:'drawerPanel',
extend: 'Ext.panel.Panel',
requires: ['Ext.panel.Panel'],

initComponent: function()
{
var me = this;

//insert panel definitions here

me.callParent();

}


});

arthurakay
1 Mar 2012, 8:25 AM
Well for starters you have JS errors and your custom view has a hard-coded ID, which means any instances of that component share the same DOM ID (very bad).

Removing the ID from your App.view.Custom class seems to fix it for me.

toxkillfraex
1 Mar 2012, 11:05 AM
I'll try that in the morning when I can reach the code again
if it works I'll mark this as answered
else I post again xP

thx

(I'm pretty sure it'll work)