MVC 3 design of composed views

Recently I faced an ugly problem in my project when I begin the design of a complex View which have to handle with many data sources. The purpose of the View is to show data related to the profile of a Customer but this profile it's made of:Basic Info, Project involved, financial data and contact info. All that data must be grouped in the same View and must be updatable. Additionally to this, in the right pane of the view, there are a few of widgets pointing to other sources not related with the customer information. My approach to solve this was:

1. Create an hybrid model which it's a mixed of variou开发者_JS百科s models like: personalInfoModel, cutomerProjectModel, financialInfoModel, and contactInfoModel. By the way, I am using Microsoft entity framework, so every model here match with an entity one to one.

2. With this hybrid model, I make the connection to the main View (let's say CustomerView) so in the first line of the view code you can see something like:

   <%@ Page ..... Inherits="...MyProject.Models.hybridCustomerModel"
   

3. Inside the main view I use:

   <% Html.RenderPartial("UC_BasicInfo"); %>
   <% Html.RenderPartial("UC_ProjectInfo"); %>
   <% Html.RenderPartial("UC_FinancialInfo"); %>
   <% Html.RenderPartial("UC_ContactInfo"); %>
   

   This is because I want to simplify things a bit by mean of user controls for rendering of the main View.

4. Every User Control (¨*.ascx), is pointing to the hybrid model so I can make the binding in the controls of the forms without problem.

5. In the controller the things looks a little disordered. For every *.ascx there is an action's Method handling the "post request". But the initial loading or Get request, is made inside the only action method which match with the View Name: CustomerView. For the purpose of usability and responsiveness I use jquery to make the post request. But the problem is that I need to make a lot of work Mapping the hybrid model with the plain model involved in the Post Request, because the DATA layer receives only the model which maps with every entity created by the Model.

6. Finally, I am using: <% Html.RenderAction() %> for the Widgets at the right pane of the view in order to get data out of the hybrid model I am using.

I wanted to ask you if there is some different and better approach in this case?

---

I think there are a couple of approaches you could use to simplify this.

Firstly instead of the hybrid view, why not make up a view-model class. This will contain your hybrid data, but will be a pure poco class. Its much safer to bind to, as you control what fields are exposed.

Having a controller method for each ascx is not such a bad thing, but if you prefer one, and to wrap the page in one Form, you can either use button type="submit" (rather than input type=submit) or javascript to tell which button was pressed and which bit of the posted viewdata to map back to your EF classes.

Another approach, and given that you have already taken a dependency on javascript, this is the one I would favour:

I'd attempt to decouple the page into the independent partials, give each one a pair of controller methods (Get and Post) and assemble the page by requesting each partial with Ajax type calls. Your sticking point here will depend on whether an update in one cascades into others : if the interdependence is fixed and acyclic this will be pretty easy to resolve otherwise you might need to develop some sort of light messaging framework - or just allow some types of update to trigger a full page refresh.