Lots of hidden divs to display in an ASP.NET MVC page with jQuery dialogs. Should I use partial views?

I've been working on my first major ASP.NET MVC application (plus lots of jQuery) for a month or so now and I'm pretty happy with it. I have a page that looks something like this. (Actual data changed to protected 开发者_运维技巧the innocent.)

<div id="main"></div>
<div id="movies"></div>
<div id="actors"></div>
<div id="actor-ratings"></div>
<div id="ratings-comments"></div>

The movies div contains a table of movies to select from. The actors, actor-ratings, and ratings-comments divs are all hidden at this point. When a movie is clicked, I have a jQuery live() event to get the click, post to the Action, get the data, and then a callback function to take the data and place it in a modal pop-up. (I think I have that order right, feel free to tell me if I'm doing it wrong anywhere.)

Since actors, actor-ratings, and ratings-comments all potentially need to be loaded in one page, my controller ends up having a huge action to load all that data in. Plus, the ratings-comments div may close the actor-ratings modal and open itself up in a new modal. And on top of it I want to implement the jQuery Address plugin to allow the back button to go back to previously opened modals.

Gets kind of complex pretty quick. Should I be using partial views for each of those divs? Should I have one controller with actions for each of those? Or a controller for each partial view/div? Partial divs seems like the way to go, but I guess I'm looking for some guidance before I jump in and break up my code. Any advice would be appreciated.

Edit: Also, my actor-ratings partial view would probably need some of the data from the actors partial view. Do I just have my ActorRatings controller action load in the actor data too? (I'm passing strongly-typed view models to the view.)

How you break up your code doesn't necessarily matter too much so long as it consistently separates logically different parts of the application.

For a page which is driven by lots of partial views which are closely related I would be tempted to put the action methods in a single controller. However, if you're looking to make a very rich AJAX-driven page then you might benefit from splitting disparate functionality into separate controllers.

Returning a partial view from the action methods is probably the most maintainable and flexible solution but returning JSON would use the least bandwidth. For what you've described I would be tempted to return partial views.

It's difficult to comment on the shared data between Actors and ActorRatings without more detail. Can't the Actors action method get all the detail it needs or is it updating due to the ActorRatings method being called?

Like you described using seperate actions returning a partial view in cases I need to deal with dynamic content of popups is the way to go. The actions can be mapped to a single controller or spread out between different ones based on content - that depends more on what else you have going on beside this view. Partial views allow you to use one actual jquery dialog where i just load the form i am currently interested in. You can then use jQuery serialize() to get the model ready and to send off to saving action if that needs to be done async. About the actor rating partial: there are 2 ways - pass data to controller action or use js to modify the partial view you recieve to your liking. First way should be used if the modifications are more seroius or require more data than there is on the view. Also if there are some rules to be followed - you don't want to put too much of that in the js. The second way is ok when just minor tune ups are required to the partial and you don't want to send the data for the roundtrip - but this can become a headache to maintain.