Extjs MVC. Multiple instances of views

If you find yourself thinking:

1. Is there a way to use multiple instances of views in extjs
2. I've created app that uses two instances of the same view in it. There are two controllers (each controller controls corresponding instance of view). When one of the instances fires event handlers in both controllers are called.
3. How to manage two instances of the same view to have different stores

then you are in right place.

The problem

You've created view. And now you realize that there is going to be a couple of instances of this view in your app (for example, there is going to be 2 identical grids but having different stores and different event handlers).

I suggest to try one of the two following solutions

Solution

Let's say your view looks like this one:

Also you have 2 stores Store1 and Store2 and two controllers.

Solution 1

In order to manage multiple instances of TestView you may create two additional views:

In this case your viewport should be looking like the following one:

Now you are able to manage both views by controllers using views' xtypes:

Solution 2

Another approach would be to have one view defined (instead of 3 as in a preveous example) but setup viewport so that it would be possible to differentiate instances of the view.