CODEWITHSUNDEEP
ajaxhtmlmodel-view-controllerasp.net-mvc-5pagedlist
Luke Stoward
Luke Stoward

Reputation: 1540

MVC 5 - URL.Action Route Bind Issue

I'm using PagedList.Mvc to create Ajax pagination of my data. However I'm having a problem with an URL.Action that is added to a data-href attribute, after the partial view has been return.

When the page loads for the first time this issue doesn't occur, it's only after I have made an ajax request using the pagination results that url.action doesn't seem to bind correctly.

This is the action that the URL.Action should link to (note the 'Route' Attribute):

[Route("Project/{code}/Request/{number}")]
public ActionResult Details(string code, int number)
{
    if (number == 0 || code == null) return new HttpStatusCodeResult(HttpStatusCode.BadRequest);

    var viewModel = _requestLogic.GetIrDetailsViewModel(code, number);

    if (viewModel == null) return HttpNotFound();

    return View(viewModel);
}

On the main view I add an Html.Action to this Action:

[HttpGet]
public PartialViewResult GetProjectRequests(string code, int page = 1, int pageSize = 10)
{
    var viewModel = _requestLogic.GetRequestsForProject(code, page, pageSize);
    return PartialView("_ProjectRequestsList", viewModel);
}

This Action is also used by the ajax call for the tables pagination, hence the page and pageSize arguments.

Inside this partial view I render a table with the model data, adding the data-href attribute to each row like so:

@foreach (var item in Model)
{
    <tr class='clickable-row' data-href='@Url.Action("Details", new {number = item.RequestNo})'>
        <td>....
}

This will render the data-href attribute like so:

enter image description here

However after I make a successful ajax call and the html for the partial is replaced. This attribute values doesn't resolve in the same way.

It ends up like this: enter image description here

Any idea why this is happening?

I bind a double click attribute to any row with the class .clickable-row which is what makes use of this data-href attribute. Hence why I need this to work.

Cheers,

Upvotes: 1

Views: 658

Answers (1)

Luke Stoward
Luke Stoward

Reputation: 1540

Thanks to @RosdiKasmin I have solved the problem. I have added a route attribute to the partial view action that is used on the initial page load and via the ajax call. Like so:

    [HttpGet]
    [Route("Project/{code}/")] // <- I've added this.
    public PartialViewResult GetProjectRequests(string code, int page = 1, int pageSize = 10)
    {
        var viewModel = _requestLogic.GetRequestsForProject(code, page, pageSize);
        return PartialView("_ProjectRequestsList", viewModel);
    }

    // GET: Requests/Details/5
    [Route("Project/{code}/Request/{number}")]
    public ActionResult Details(string code, int number)
    {
        if (number == 0 || code == null) return new HttpStatusCodeResult(HttpStatusCode.BadRequest);

        var viewModel = _requestLogic.GetIrDetailsViewModel(code, number);

        if (viewModel == null) return HttpNotFound();

        return View(viewModel);
    }

This means that the Url.Action makes use of the existing URL when creating the action link.

Upvotes: 2

Related Questions