asp.net-mvcpagination

MVC Paging with partial views


I'm a relatively new MVC user, and am having difficulty getting paging to work properly in MVC.

Basically I have a load of search results which are rendered in a partial view (using the begin form method like so):

using (Ajax.BeginForm("Search", "Home", new AjaxOptions
{
    HttpMethod = "GET",
    InsertionMode = InsertionMode.Replace,
    UpdateTargetId = "searchResults",
}))
{
    <input type="text" name="searchString" />
    <input type="submit" value="Search" />
}

And the partial view is rendered thusly:

@foreach (var item in @Model)

{

<li>@Html.ActionLink(item.Name, "Result/" + item.Id, "Result")</li>

}

@{if(ViewBag.HasPrevious)
    {
        @Html.ActionLink("<<", "Search", new { searchString = ViewBag.query, page = ViewBag.CurrentPage-1 })
    }
}

@{if(ViewBag.HasNext)
    {
        @Html.ActionLink(">>", "Search", new {  searchString = ViewBag.query, page = ViewBag.CurrentPage+1 })
    }
}

My problem is that the >> or << links simply create a blank page with the list of results on it, and doesn't persist the markup of the 'top' index page.

Does anyone have any ideas re this.

NB am new to this site, and I will upvote any answers.


Solution

  • Html.ActionLink generates a normal anchor. When you click on this anchor it simply redirects the browser to the address that this link is pointing to. That's the reason why you are seeing the contents of the partial in a new windows.

    If you want to refresh only a portion of the page without redirecting you could use an AJAX link (Ajax.ActionLink) instead:

    @Ajax.ActionLink(
        "<<", 
        "Search", 
        new { 
            searchString = ViewBag.query, 
            page = ViewBag.CurrentPage - 1 
        },
        new AjaxOptions
        {
            HttpMethod = "GET",
            InsertionMode = InsertionMode.Replace,
            UpdateTargetId = "searchResults"
        }
    )