Question

I think there is a simple answer to this, but for some reason I am hitting a writers block today. I have an app which people can search (like any app 🙂 ) and generate a list view. From that list view, you can view details, which will take you to a details view. No JS, just another page. But, what I would like to do is to have a back/next button within the details view so that you can parse the result set without having to go back to the list and then select the next record.

I have had two ideas on accomplishing this. Idea 1) Have a next/previous record field in my custom class. However, this wouldn’t work as the search query will not necessarily return consecutive results and I would have to query the DB each time to get those next/prev listings. Idea 2) Have a list of IDs or some custom object passed in the view state for each detials view corresponding to the search results. On this one, I am not sure of the ‘overhead’ associated with this method.

Any suggestions from the SO community?

Thanks!

Answer 1

Construct the link that opens the details view so that it has next and previous parameters that contain a list of the previous/following elements as well as the id of the current element. Probably easiest to do if you iterate through the list model data by index rather than using foreach — that way you just reference the previous/next element relative to the current element when finding their ids. Make sure to handle the first and last elements correctly.

In your controller action the next/previous parameters should be nullable — if you don’t get there from the list, you don’t render the next/previous buttons. You could “post” the details view action and put the extra parameters in the form rather than the URL so the user can still bookmark the url. Note that this has it’s own issues though with regards to the browser’s back/forward button and refreshing.

<% for (int i = 0, len = Model.Count(); i < len; ++i)
   {
      Foo model = Model.ElementAt(i);
      string prev  = i == 0 ? null : string.Join( ",", Model.Take(i).Select( m => m.ID.ToString() ).ToArray() );
      string next = i == (len - 1) ? null : string.Join( ",", Model.Skip(i).Select( m => m.ID.ToString() ).ToArray() )
 %>
   <% using (Html.BeginForm("Details","Bar", new { id = model.ID } )) { %>
        <%= Html.AntiForgeryToken() %>
        <%= Html.Hidden( "Prev", prev ) %>
        <%= Html.Hidden( "Next", next ) %>
        <input type="submit" value="Details" />
   <% } %>
<% } %>

I would probably also use some jQuery to change the input button to a link that submits the enclosing form with a click event handler, but that’s just my preference for the UI.