Question

I am developing an application in ASP.NET MVC structure.
I was wondering, I am trying to create a site that only has one page, it has a navigation bar on the left (Which is a list of user input), and then the main content in the middle.

My question is, can I make the navigation bar (The user input list) static, and make the main content change, based on the user input, with an asynchronous AJAX postback? I would have multiple controllers which would set different results to the main content, based on the user input.

How would I go around doing so, partial views and calling actions with asyncpostback’s?

Answer 1

Yes, I would do exactly as you have suggested – have actions that render PartialView([name]) and use, probably, jQuery’s ajax to fetch the content.

You can then use jQuery to inject the html into the content panel.

Where it might get interesting is if you need to have css added to the head section of the page.

But then, with diligent use of a single CSS, or at least a single group of CSS files, you can sidestep that.

Be aware though, that it does complicate form post-backs if the dynamically injected content has forms. You would need to hijack the form submit process and turn it into another ajax call to get the resulting html into your content panel – you might even need to hand-crank the form submission because I don’t think you can trigger form submission as an Ajax operation.

I’ve done a similar thing with named iframes (doesn’t necessarily need script), as you can render a form with a target which is equal to the name of an IFrame; and it means that the iframe content can be a full view instead of a partial (and therefore has full control over its own script and css). Of course, then you have issues with sharing data between the host page and that frame.