A working MVC sample that handles multiple instances of the same view with controller
We have developed a big online CRM application with Ext 3.x for the last couple years. It's working pretty well and we thank Ext JS for that.
When we were starting the project we were a team of people that had high experience in developing big enterprise applications. What we had lacked was the skill\knowledge of developing web applications. That's where Ext JS saved our lives And when we saw the famous desktop sample and we decided to go with it because it was design free, easy to manage. We still don't regret this decision since it works pretty well.
Now we've started on another project which is also a big multi-user application and even though it would be so much easier if we had used the same code base of our Ext JS 3.x application, we decided to use Ext JS 4, in order to keep ourselves up-to-date with the enhancements in the framework.
So as I said it's an application in the form of your desktop sample: Some windows are single instance (like the list of Products) and some can be multiple-instance (like the Product window opened for each product at the same time). Actually being a desktop application or not this is a basic need in any enterprise application.
We have read about the MVC and tried to implement it to our new windows\forms. We didn't try to modify the desktop sample code to work in MVC way since it isn't the part we are concerned about. What we want is to use MVC in our application logic. And we believed using MVC will bring structure to our code: Javascipt files of our views wouldn't have logic in them, just the design code and all the logic would be in controllers.
But MVC structure in Ext JS 4 seems kind of immature for us. And we hit the wall when the time came to handle multiple-instances of the same view. We were expecting to be able to create a controller for our each view instance. And also expecting these controllers to be destroyed when the window is closed. But things don't work that way: Once a controller is loaded, it will exist as long as the application exist. And as much as we understand if we want to handle multiple-instances of a view with a controller (since we can't create more than one of the same type controller), we shouldn't use "Refs", we should do everything in the event handlers since this is the only part where we can get the correct reference to the view that fired the event. And this seems totally inefficient to us: ComponentQuery'ing a control over and over, not being able to keep a reference to that. These all seem wrong. We should have been able to create multiple controllers for our each view, so our controller code can be much more clean and can also work much more efficiently.
But with these limitations I don't know how this will happen. Yesterday I've searched the forum all day to find a solution. There are so many threads about the same problem, everybody is troubled about the same subject. But when we look at the official examples there isn't a sample that clears this matter or a working, support validated sample in any of those threads. There are a few samples but they have so deep inner workings on Ext JS source that we can't be sure whether they will be compatible with future releases of Ext JS or not.
It seems like Ext JS 4 MVC structure is not suitable\efficient for "multiple instance of view" style applications. So if there isn't anything that we are missing than we will sadly switch back to non-MVC way. And before doing that we wanted to be sure that there really isn't a way, by posting one more "multiple instance of controller\view" like thread to the forum
I immediately read the ViewController documentation and it's really free of all the limitations found in Ext JS. It will take time to fully learn what's more in DeftJS but for now it's MVC enhancements are what we need. So instead of going with the old way we are thinking of using this.
The only question that's bothering us that whether DeftJS is flexible enough to be compatible with future releases of Ext JS or not. Because this isn't just a simple third-party plugin; we will be architecting our app on this MVC structure.
Ok, I understand your problem very good. In our company we have several projects using ExtJs 4. And at first time we also tried to put all the logic into controllers. And then got same problems that you described: non-destroyable controllers with huge number of code. In the other side we could put logic into views, but this is an old approach which not always handy.
So we decided to balance these methods. Views may rule their specific logic. Controllers rule global logic. For example, the Product window contains methods loadProduct(product) and updateProduct() which loads information from record into form fields and back respectively. Grid of products contains method getProducts(categoryId). Now the controller handles user events and calls these view specific methods.
This approach is very easy for us. The only question is which methods should we place into views and which into controllers? This is up to you, depends on architecture.
We're in the same situation. Large application. Many controllers and 'sub-controllers'. Many more views. And sometimes the views are shared between controllers. ExtJS makes the initial, simple usage pretty easy, but it begins to get very complicated and difficult to manage when the application scope increases. DeftJS seems to fill a large void in ExtJS MVC.