How to avoid using Frames

[pravin_bluebird]

I have an application where i have divided the layout into three region north,west,center.
I have different links in west region.and two tabs in Center region.
My task is to open appropriate grid depending on link clicked from west region.
What i do is i take one frame in one tab and created different js and HTML for each grid.....

Code when the link in west region panel is clicked


panel.body.on({
click: {
stopEvent: true
, delegate: 'a'
, scope: null
, fn: function(e, target) {
layout.getRegion('center').getTabs().getTab('center-result').activate();
Ext.get('center-result').dom.src = target.href;
}
}
});

where center-result is a frame.............

Is it the right way ?....

Because when the frame is loaded all js and css are loading again.
Which makes application slower.
Is there any other way of doing.


or

I am thinking to take five different grid div in tab.
And activate the grid on appropriate link click and hidding the rest div by setting innerHTML to blank.


Sorry for My bad English.....................

Please sugget me the best way to do this

Thanks in Advance

[thejdog]

I'd actually like to know this myself too! I haven't been quite sure how to do this. As I want to have 4 tabs up top "members admin", "user group admin", "news admin" and "history admin". But I want to keep the 4 seperate admin panels in four different javascript files say:

membersAdmin.js
userGroupAdmin.js
historyAdmin.js
newsAdmin.js

But haven't quite sure how to make layoutAdmin.js call to the other scripts and have the other scripts have "control" over content of that "tab panel" area.

James

[Animal]

I'd actually like to know this myself too! I haven't been quite sure how to do this. As I want to have 4 tabs up top "members admin", "user group admin", "news admin" and "history admin". But I want to keep the 4 seperate admin panels in four different javascript files say:

membersAdmin.js
userGroupAdmin.js
historyAdmin.js
newsAdmin.js


Why?


But haven't quite sure how to make layoutAdmin.js call to the other scripts and have the other scripts have "control" over content of that "tab panel" area.

James

Just code your application as a singleton object which manages 4 other objects. It knows when they have been created, and when they need creating. It knows that Layout, and the Region to put those 4 other objects in.

You do not need frames, you need to write an application controller singleton object.

[mnugter]

The problem with having a lot of javascript on 1 page is memory usage. I had an Iframeless version of an application which was meant to run for about 2-3 hours a day without closing it. Especially IE is a bit leaky. I now have the main layout in 1 document and the content in an iframe. I also use a lot of wizards to add Data (Like a new customer). I open the wizards in a new window.

Looks something like this:

-------------------------|
|Titlebar |
|------------------------|
| M | |
| E | IFRAME |
| N | |
| U | |
|------------------------|

Because all the extra javascript is executed in the Iframe and the browsers hit the garbage collector on leaving a page this solved (most of my) memory issues.

To speed up loading the Ext Library, my own library and the css I used the trick described here:

http://extjs.com/forum/showthread.php?p=18672#post18672

This ensures you only load the javascript and css once.

Hope this helps a little bit...

[steffenk]

why using different HTML for the grids?
I would change store and ColumnModel for each grid after clicking the link and would use same functions.

[pravin_bluebird]

why using different HTML for the grids?
I would change store and ColumnModel for each grid after clicking the link and would use same functions.
__________________
vg Steffen
Gr8 idea ,,,
But what abt the header ,filter and footer,add and delete operation of records which are related to grid.........Do i have to create function for this also ?.......

regards

[steffenk]

only change whats different. You can do it all in one function. Maybe you have to prepare each one and only change the source. (really depends on your app concept)