PDA

View Full Version : Adding and removing a component from the panel



bkraut
13 Aug 2011, 9:16 AM
Hi,

I would like to add and then remove a component from the Panel as shown below:



var form1 = new Ext.ux.TaskListFilterForm({
id: 'filterForm'
});

var filterPanel = new Ext.Panel({
title: 'Filters',
id:'reporter-filters',
ref: 'reporterFiltersForm',
border: false,
region:'east',
width: 300,
margins: '0 0 0 0',
cmargins: '0 0 0 0',
padding: '0 2px',
layout: 'form',
tbar: [{
text: 'Add',
handler: function() {
filterPanel.add(form1);
filterPanel.doLayout();
},
scope: this
},{
text: 'Remove',
handler: function() {
filterPanel.remove(form1);
filterPanel.doLayout();
},
scope: this
}],
items: [{
html: 'Default filters'
}]
});



When I click on Add the form1 is added to the Filters Panel, then I click on the Remove button, and form1 is successfully removed.
When I press again Add, the following exception is thrown. Why?



uncaught exception: [Exception... "Component returned failure code: 0x80004003 (NS_ERROR_INVALID_POINTER) [nsIDOMHTMLDivElement.insertBefore]" nsresult: "0x80004003 (NS_ERROR_INVALID_POINTER)" location: "JS frame :: http://localhost:8080/com.objectverse/lib/ext/ext-all-debug.js :: <TOP_LEVEL> :: line 13125" data: no]


Any help appreciated.

dmackerman
15 Aug 2011, 12:44 PM
Is Ext.ux.TaskListFilterForm a custom class you've written?

bkraut
16 Aug 2011, 1:49 AM
Yes it is. Actually I think I found the problem. It is the problem of scope. If I create a variable in initComponent method, then I assign it to the panel and then delete it from the panel it actually is not referenced any more. I created everything dynamically now and it is working flawless.
Thanks.