View Full Version : Beginner Question regarding loading Views with MVC ExtJS 4

Will de la Vega
13 Feb 2013, 10:50 PM
Hi friends @ the forum.

I am building my first Ext JS 4 App with MVC and trying to follow patterns carefully. I have been a RIA developer for many years and I am new to this framework.

My issue is the navigation between views. I have the usual layout, a ViewPort, inside a border layout, then a TreePanel at the west region and a panel with a toolbar at the top and a panel with the content that is supposed to change depending on which view loads and unloads.


I was considering adding and removing tabs from a tab panel for the views but I donīt really want to show the user the tabs and also think that for performance purposes it could be better to destroy the views when not used.

Also the approach a friend shared (very ExtJS 3 I think..) with me was to have this layout in as many web pages as views in my app and add a url to a different page i the node click of the treeview panels, thus changing the web page between views. It really doesnīt feel just right albeit that this friend of mine knows what he is saying, but I believe that a good RIA app should run inside a single page.

So, I know that for a newbie it may be a very silly question, but friends, How can I load a view to my content panel depending on the treeview panel (left panel) click and unload or destroy the one being abandoned by the user? is this the right approach?

Is there any decent resource or documentation that explains how to do this in a cleanly fashion using Ext JS 4 with MVC and that may be compatible with Architect? I apologize for the long post I just wanted to be very clear in what I am trying to do. I appreciate your help in advance and also I want to say that I am happy to be part of this group of experts. Thanks.

15 Feb 2013, 1:46 PM
When you say load a new view (in the center region) where is the content coming from?

Will de la Vega
15 Feb 2013, 3:06 PM
Some of those views would be created in Architect as well, views with a grid that can add, modify and delete items, just the basics. But there are some other cases where the view needs to be constructed on the fly. Some elements would need to be rendered depending on the user rol. To be more precise this app is about e-learning and depending on the student's plan, a set of four, five or more small components need to be created on the page. Creating this app in Architect using drag and drop seems impossible, however I definitely donīt want to leave Architect and start coding somewhere else as one of the main goals in this project is to be able to open it in Architect and make modifications, so how can I add this "dynamic" content views and keeping them being loaded and destroyed after use in a a clean fashion MVC compatible? Probably it is that I am a newbie with Sencha, but believe me I am really loving it and I plan to become someone who in the future may help in this forum as well, it is just that all beginnings seem to be hard. :) Thanks in advance for your help.