Question

I’m developing an MVC3 application with EF and I wanted to make the UI fluent using jQuery ajax, the user will be able to navigate through the url, if he knows it or maybe he might receive a link pointing to a particular route, but, once the page is fully loaded it needs to be fluent, so I came up with one idea and I would like to discuss it here before I make the changes to the solution.

Here is what I came up with:

TestController.cs (Methods code has been omitted for simplicity)

public ActionResult Index() { ... }

public ActionResult Create() { ... }
[HttpPost]
public ActionResult Create(Test test) { ... }

public ActionResult Update(int testID) { ... }
[HttpPost]
public ActionResult Update(Test test) { ... }

public ActionResult Delete(int testID) { ... }
[HttpPost]
public ActionResult Delete(Test test) { ... }

So far it looks like most controllers. My views are as follows:

Views\Test\List.cshtml
Views\Test\Create.cshtml
Views\Test\Details.cshtml
Views\Test\Delete.cshtml

Now since I wanted to do it async: I’ve changed my List view so I could add, modify and remove from the list, so far is working like a charm. Plus, the user could still be able to navigate through the application using the url’s, note that every link inside the application will perform an ajax request to do the actual work, there are no Route/Action links.

By now the application is working as expected, but now I came across something: there are views that I need to be ActionResult and PartialViewResult, that is because the user could type in the url: “/Admin/Test”, which should return the full page, or could click on an anchor which will load only the content of the “/Admin/Test” and display it. To avoid the famous page inside page errors I wrote a function to send the request, and when the request arrives it selects only what I need, avoiding then the page inside page, and to duplicate views, but, the response is the whole page which, I don’t need to say, it’s not the best option, but since the application will be used by lan I didn’t care too much about the payload of the response, but then I needed to write javascript code inside the views, so my solution was like null because using the jQuery selector to get only what I need the javascript wasn’t there.

As for my new solution to solve my last solution:
I thought I might leave the original view as is, and create another view appending the word “Partial” after the original name, creating another method in the controller with the same naming convention, plus adding the new Route to my Route Table.

To wrap things up, what I need is the following:
– If the user types in “/Test” the response should be the entire page, loaded like the old days, screens flashing white and such.
– But if the user clicks the Test link in the navigation bar, the response should be async and refreshing only the content of my layout.

Any ideas? thoughts? suggestions?

Answer 1

In your actionmethod you can have

 if (Request.IsAjaxRequest())
      return PartialView("_somePartialView");
 else
      return PartialView("_someOtherPartialView");