CODEWITHSUNDEEP
ajaxasp.net-mvcapi
user393014
user393014

Reputation: 475

handle direct url with history api in asp.mvc

I have my site like http://mysite.com/ and on the index page i have search box and for the result i am using jqgrid. When user click row in the jqgrid row I am taking data from cells and do ajax call to server and fetch json data and once data arrived I hide the search box and jqgrid and show another div which is I kept for result. In short, user will be on the same page just div's hide/show.

Now I have seen history api and used pushState and popstate so my url becomes in the addressbar like http://mysite.com/controller/action/para1/para2 (here para1 and para2 are the parameters i am passing to action). Everything is ok so far.

Now the problem is if I copy this URL "http://mysite.com/controller/action/para1/para2" and if I open this with let's say different browser and hit enter it display just json data. So, I am confused that how to handle when user directly use that url in controller.

I was thinking to check in the controller action if the request is AJAX then return json data otherwise full page, is that right approach? OR something on the client side we have so that it load the same way as earlier.

Thanks

Upvotes: 2

Views: 809

Answers (2)

RyanJMcGowan
RyanJMcGowan

Reputation: 1515

Use a separate controller or action method for AJAX and for Views. The View controller should match the URL. The Ajax controller should be the less "pretty" URL since it's behind the scenes.

You need to set up a routing definition in global.asax (MVC 3) or App_Start/RouteConfig.cs (MVC 4) to handle the parameters if you haven't already done that.

routes.MapRoute(
            "MyRoute",
            "MyUrlController/{action}/{para1}/{para2}",
            new
                {
                    action = "Index",
                    para1 = UrlParameter.Optional,
                    para2 = UrlParameter.Optional
                }
                );

Then in the View controller:

public ActionResult Index(string para1 = "Default Value", string para2 = "Default Value")
    {
        // ...Handle parameters...

        return View("_MyView", viewModel);
    }

Returning a View object type is the key. The History API URL doesn't get it's data from the same AJAX source controller which returns a PartialViewResult.

Upvotes: 0

Esteban
Esteban

Reputation: 3139

if I copy this URL "http://mysite.com/controller/action/para1/para2" and if I open this with let's say different browser and hit enter it display just json data.

it only display json data because its ajax call only so how to deal with that so that it also display the same page even user directly access the url.

I think what you're looking for is Request.IsAjaxRequest():

public class FooController : Controller {
    public ActionResult GetFoo(int id) {
        var model = _fooService.Get(id);

        if (Request.IsAjaxRequest())
            return PartialView("_Foo", model);

        return View("Foo", model);
    }
}

Note: It's recommended to use WebAPI controllers to handle only json data. So if the user got there by typing the url the mvc controller will handle it and if you need to get the json data for that view you could call the webapi controller.

Upvotes: 6

Related Questions