ASP.NET MVC Paging for a search form

Question

I've read several different posts on paging w/ in MVC but none describe a scenario where I have something like a search form and then want to display the results of the search criteria (with paging) beneath the form once the user clicks submit.

My problem is that, the paging solution I'm using will create <a href="..."> links that will pass the desired page like so: http://mysite.com/search/2/ and while that's all fine and dandy, I don't have the results of the query being sent to the db in memory or anything so I need to query the DB again.

If the results are handled by the POST controller action for /Search and the first page of the data is rendered as such, how do I get the same results (based on the form criteria specified by the user) when the user clicks to move to page 2?

Some javascript voodoo? Leverage Session State? Make my GET controller action have the same variables expected by the search criteria (but optional), when the GET action is called, instantiate a FormCollection instance, populate it and pass it to the POST action method (there-by satisfying DRY)?

Can someone point me in the right direction for this scenario or provide examples that have been implemented in the past? Thanks!

Answer 1

Make the Search parameter part of your View Model:

public SearchViewModel
{
    string SearchParameters { get; set; }
    List<SearchObjects> SearchResults { get;set; }
}

Then just set the Search Textbox equal to SearchParameters.

You cannot "store" the search query unless you bring back ALL results and then store those in the page somehow. That is horribly inefficient. The web is stateless, so you will have to go back to the database and re-query for more results.

Answer 2

You will probably want to throw all that data in the front end and do pagination by javascript if you want to query the database once.

Other than that, I think ASP.NET support some form of caching in which I have no resources to share with you, but I'm quite sure it has to do with sql server 2008 only.

Answer 3

Hey,

I understand what you are saying; you could change the form to use buttons and post the page back everytime. Or, you could pass all the criteria in the URL for the paging as querystring variables. Or you could use JQuery to do the post (it has a $.post method that can be invoked from a link click or other click (http://api.jquery.com/jQuery.post/).

HTH.

Answer 4

This problem goes away if you include the search text, as well as the current results page, in your querystring instead of POSTing the search text. As an added benefit, your users can then bookmark their search results.

To do this your search button just needs to build the GET request URL using the current value of the search box. This can be done either in javascript or by using GET as your search form's method attribute, e.g. <form method="get" action="/search">.

Answer 5

My method is to have an Action that handles both the post and the get scenarios.

This is my which can be handled by both GET and POST methods:

public ViewResult Index([DefaultValue(1)] int page,
                        [DefaultValue(30)] int pageSize,
                        string search,
                        [DefaultValue(0)] int regionId,
                        [DefaultValue(0)] int eventTypeId,
                        DateTime? from,
                        DateTime? to)
{
    var events = EventRepo.GetFilteredEvents(page, pageSize, search, regionId, eventTypeId, from, to);
    var eventFilterForm = EventService.GetEventFilterForm(from, to);

    var eventIndexModel = new EventIndexModel(events, eventFilterForm);

    return View("Index", eventIndexModel);
}

The eventFilterForm is a presentation model that contains some IEnumerable<SelectListItem> properties for my search form.

The eventIndexModel is a presentation model that combines the eventFilterForm and the results of the search - events

The events is a special type of IPagedList. You can get more information and code for that here and here. The first link talks about IPagedList where as the second link has an Advanced Paging scenario which you should need.

The advanced paging has the following method that I use:

public static string Pager(this HtmlHelper htmlHelper, int pageSize, int currentPage, int totalItemCount, RouteValueDictionary valuesDictionary)

And I use it like so:

<%= Html.Pager(Model.Events.PageSize,
               Model.Events.PageNumber,
               Model.Events.TotalItemCount,
               new
               {
                   action = "index",
                   controller = "search",
                   search = ViewData.EvalWithModelState("Search"),
                   regionId = ViewData.EvalWithModelState("RegionId"),
                   eventTypeId = ViewData.EvalWithModelState("EventTypeId"),
                   from = ViewData.EvalDateWithModelState("From"),
                   to = ViewData.EvalDateWithModelState("To")
               }) %>

This creates links that look like:

/event/search?regionId=4&eventTypeId=39&from=2009/09/01&to=2010/08/31&page=3

HTHs,
Charles

Ps. EvalWithModelState is below:

PPs. If you are going to put dates into get variables - I would recommend reading my blog post on it... :-)

/// <summary>
/// Will get the specified key from ViewData. It will first look in ModelState
/// and if it's not found in there, it'll call ViewData.Eval(string key)
/// </summary>
/// <param name="viewData">ViewDataDictionary object</param>
/// <param name="key">Key to search the dictionary</param>
/// <returns>Value in ModelState if it finds one or calls ViewData.Eval()</returns>
public static string EvalWithModelState(this ViewDataDictionary viewData, string key)
{
    if (viewData.ModelState.ContainsKey(key))
        return viewData.ModelState[key].Value.AttemptedValue;

    return (viewData.Eval(key) != null) ? viewData.Eval(key).ToString() : string.Empty;
}

Answer 6

I recommend cacheing your search results and giving them an ID. Then for each paging link, you can reference the search ID as a parameter (on each search page link) and in your action, pull it from cache, then query over it.

Using this method, you don't need to worry about anything other than the first POST submit of the search form.

Refer to my post for more details.