PDA

View Full Version : ExtJS Desktop grid won't render again



eyurdakul
29 Apr 2009, 10:53 AM
Hi guru's,

i am writing my second ExtJS application and using the desktop example for that. I've managed to add a grid module with server-side data store and placed it on the desktop. the grid works and store loads picobello. My problem is when i close the windows and try to re-open it, the grid doesn't show up. I've compared my window with other example windows but couldn't see any difference. This is the example code:



MyDesktop = new Ext.app.App({
//exactly same configuration as the example
)};
var pagesGrid = new Ext.grid.GridPanel({
//bla bla
});
MyDesktop.PageManager = Ext.extend(Ext.app.Module, {
//this is my window
items: pagesGrid
});


do i have to define the grid in the MyDesktop.PageManager, or whatelse could be the problem? Thanks in advance.

Animal
29 Apr 2009, 10:54 AM
By default, clicking the "X" button destroys the Window which destroys all its child Components.

You should use closeAction: 'hide', and that will just hide the Windw, and it can be just shown next time.

29 Apr 2009, 10:59 AM
another use of the desktop. wow.

eyurdakul
29 Apr 2009, 11:07 AM
thanks for the fast response animal. yes it indeed seems to be the problem but if i add this, the window doesn't close just minimizes in the taskbar. other windows closes multiple times without problem but they define the components in MyDesktop.PageManager. shall i put another container in the window, define the closeaction property and place grid in this child panel? Does apply closeaction just for the main window? thanks.

eyurdakul
1 May 2009, 4:40 AM
ok i change my question,


MyDesktop = new Ext.app.App({
init :function(){
Ext.QuickTips.init();
},

getModules : function(){
return [
new MyDesktop.GridWindow(),
new MyDesktop.TabWindow(),
new MyDesktop.AccordionWindow(),
new MyDesktop.BogusMenuModule(),
new MyDesktop.BogusModule(),
new MyDesktop.PageManager()
];
},
// config for the start menu
getStartConfig : function(){
return {
title: 'Jack Slocum',
iconCls: 'user',
toolItems: [{
text:'Settings',
iconCls:'settings',
scope:this,
handler: function(){
alert('yes');
}
},'-',{
text:'Logout',
iconCls:'logout',
scope:this
}]
};
}
});

i assume this is a class that extends Ext.app.App and all components are defined as new MyDesktop.AccordionWindow(). defining components with var bla = and addding closeAction hide is a nice option so you can reset variables and hide the window for next use but it overwrites the desktop application's close function which is also interacted with the taskbar. So what is the proper way of adding some sub components to MyDesktop class that don't get destroyed and recallable. sorry for being such a newbie.

Animal
1 May 2009, 5:34 AM
I'm not that familiar wit the Desktop extension.

If you want the close action to close the Window, but not destroy its contents, then add a beforedestroy listener which removes (without destroying - see docs) the child item(s)

cristianomaddog
16 Jul 2009, 6:01 AM
I did this and it worked for me, i don't know if it is the best way but it worked.

I created a new type of window inside the Desktop.js. This window, when closed, doesn't distroys its elements becouse it hides. Ok, if the window is set to hide it seems to be minimized, but i coul avoi this by doing some modifications to the close and show methods.


this.createHidableWindow = function(config, cls){
var win = new (cls||Ext.Window)(
Ext.applyIf(config||{}, {
manager: windows,
minimizable: true,
maximizable: true
})
);
win.render(desktopEl);

win.cmenu = new Ext.menu.Menu({
items: [

]
});

win.on({
'activate': {
fn: markActive
},
'beforeshow': {
fn: function(win){
win.taskButton = taskbar.addTaskButton(win);
win.animateTarget = win.taskButton.el;
markActive(win);
}
},
'deactivate': {
fn: markInactive
},
'minimize': {
fn: minimizeWin
},
'close': {
fn: removeWin
},
'beforeClose': {
fn: function(win){
win.hide();
removeWin(win);
return false;
}
}
});

layout();
return win;
}

cristianomaddog
16 Jul 2009, 6:41 AM
Updated code.

There was a bug when window was minimized an then maximized. It would create a new taskbarItem. Now itsfixed.


this.createHidableWindow = function(config, cls){
var win = new (cls||Ext.Window)(
Ext.applyIf(config||{}, {
manager: windows,
minimizable: true,
maximizable: true
})
);
win.render(desktopEl);

win.hasTaskBarBtn = false;

win.cmenu = new Ext.menu.Menu({
items: [

]
});

win.on({
'activate': {
fn: markActive
},
'beforeshow': {
fn: function(win){
if(!win.hasTaskBarBtn){
win.taskButton = taskbar.addTaskButton(win);
win.animateTarget = win.taskButton.el;
win.hasTaskBarBtn = true;
}
markActive(win);
}
},
'deactivate': {
fn: markInactive
},
'minimize': {
fn: minimizeWin
},
'close': {
fn: removeWin
},
'beforeClose': {
fn: function(win){
win.hide();
if(win.hasTaskBarBtn){
removeWin(win);
win.hasTaskBarBtn = false;
}
return false;
}
}
});

layout();
return win;
}

Lukman
16 Jul 2009, 3:54 PM
Err ... all this trouble can be avoided if you use lazy instantiation of your pagesGrid (i.e. using xtype).



MyDesktop = new Ext.app.App({
//exactly same configuration as the example
)};
var pagesGrid = {
xtype: 'grid',
//bla bla
};
MyDesktop.PageManager = Ext.extend(Ext.app.Module, {
//this is my window
items: pagesGrid
});OR by setting autoDestroy: false in your Ext.Window config:



MyDesktop = new Ext.app.App({
//exactly same configuration as the example
)};
var pagesGrid = new Ext.grid.GridPanel({
//bla bla
});
MyDesktop.PageManager = Ext.extend(Ext.app.Module, {
//this is my window
items: pagesGrid,
autoDestroy: false
});

cristianomaddog
16 Jul 2009, 5:39 PM
NIce, I'll try in this way. Its a lot better.

denu
18 Dec 2011, 12:52 PM
Whatever solution from here wouldn't I try, I get to the same point:


li is null

which is thrown from here (Taskbar.js):



removeButton : function(btn){
var li = document.getElementById(btn.container.id);
btn.destroy();
li.parentNode.removeChild(li);
var s = [];
for(var i = 0, len = this.items.length; i < len; i++) {
if(this.items[i] != btn){
s.push(this.items[i]);
}
}
this.items = s;
this.delegateUpdates();
}



Anyone can help with that?

Greetz

denu
22 Feb 2012, 12:49 PM
bump.

still havn't dealt with that, can anyone please look at that?