How to make rich/compound views

Question

Hi,

I have recently started to examine asp.net mvc. I have studied quite a few examples and common to these are that they contain quite simple scenarios, where a view will map to either an instance of a type in the model or a list of a paritcular type from the model.

I'm looking for guidelines to compose/composite views. In the long term I would like Ajax to be part of the equation, but for now I'm looking for a simpler non Ajax setup.

The problem:

Here is a description of a contrieved problem. A domain model contains the types A and B.

class A
{ String ID, String Name, int Age
  List<B> ListOfB
}

class B
{ String ID, String Name, String Url}

I would like to have a that allows the following:

• A DropDownList showing type A information

• Details about the particular A picked in the dropdown

• A list showing type B's related to the selected type A

• A form that makes it possible to edit the data of a selected type A

• A form that enables the user to add a new B.

The view should not show all of this at once, instead it has to show different combinations of information and functionality according to user input. Combinations of detail and functionality could forexample be:

1. Initially only show the dropdownlist containing A's
2. If an A has been selected in the dropdown:
   • Show the particular A as selected in the dropdown
   • Show detail info about the selected A
   • Show list of detail info of related type B's
3. The user wants to edit a particular A
   • Show the particular A as selected in the dropdown
   • Show form that allows user to edit particular A
   • Show list of detail info of related type B's
4. The user wants to add a new B
   • Show the particular A as selected in the dropdown
   • Show detail info about the selected A
   • Show list of detail info of related type B's

That could look something like this (used the web version of balsamiq mockups - what a fantastic invention!):

Combination 2: http://img402.imageshack.us/img402/5263/parentviewa2selected.jpg

Combination 4: /http://img508.imageshack.us/img508/6797/parentviewnewb.jpg

Creating the view and controller

Since the solution has to allow for different combinations of data and functionality, I think it would be smart to have a parent view (not to be confused with a masterpage) that contained placeholders for parital views. Then, the parent views controller could make up the right combinations of model data and partial views and feed these to the parent view.

Finally; the questions:

• Is my way of thinking in accordance with the asp.net mvc methodology?

• Can you explain/show (not necessarily all of it) how the controller can compile the right combination of partial views and feed these to the parent view?

• Can you point me towards an Ajax based solution?

• Can you suggest books/links that contain examples of complex views?

Answer 1

asp.net mvc fully supports all of your requirements but there are few things you should get up to speed on:

1. You should look at implementing view models to help seperate your domain model from your specific views. Here is a good link on how to start this.

2. You need to get up to speed with a client side javascript framework for the ajax work with partial html rendering. jquery will do this or ms ajax. Here is an example

To your detailed questions:

Is my way of thinking in accordance with the asp.net mvc methodology?

Asp.net mvc is not going to constrain you at all so essentially this is fully supported

Can you explain/show (not necessarily all of it) how the controller can compile the right combination of partial views and feed these to the parent view?

You can use partial views if you want to seperate bits of code out and can easily refresh them by loading them independently using ms ajax or jquery. You would have a controller that mapped onto your parent view and can delegate and refresh partial views in ajax calls.

Can you point me towards an Ajax based solution?

jquery will do this or ms ajax. Here is an example

Can you suggest books/links that contain examples of complex views?

This link talks a lot about this.