jqgrid - Guidance on a better way to retain filtering options when using ASP.NET MVC 2

Question

I have an ASP.NET MVC 2 application which in part allows a user to filter data and view that data in a JQGrid.

Currently this consists of a controller which initialises my filter model and configures how I wish my grid to be displayed. This information is used by a view and a partial view to display the filter and the grid shell. I use an editor template to display my filter. The JQGrid makes use of a JsonResult controller action (GET) to retrieve the results of the filter (with the addition of the paging offered by the grid - only a single page of data is returned by the GET request. The Uri used by the grid to request data contains the filter model as a RouteValue - and currently contains a string representation of the current state of the filter. A custom IModelBinder is used to convert this representation back into an instance of the filter model class.

The user can change the filter and press a submit button to get different results - this is then picked up by an (HttpPost) ViewResult action which takes the filter model - reconstituted by a further model binder and causes the grid shell to be updated.

So I have:

FilterModel Represents the user's desired filtering characteristics

FilterModelEditorTemplateSubmissionBinder : DefaultModelBinder - used to convert the request information supplied from a user changing their filtering characteristics into the appropriate FilterModel instance.

FilterModelStringRepresentationBinder : IModelBinder - used to convert the encoded filter from the JQGrid GET request for data so the correct request is made of the service which is ultimately performing the query and returning the relevant data.

ViewResult Index() - constructs a default filter, configures the grid specification and returns the view to render the filter's editor template, and the grid shell.

[HttpPost]ViewResult Filter(FilterModel filter) - takes the new filter characteristics and returns the same view as Index(). Uses FilterModelEditorTemplateSubmissionBinder to bind the filter model.

JsonResult GetData(FilterModel filter, string sidx, string sord, int page, int rows) - called from the JQGrid in order to retrieve the data. Uses FilterModelStringRepresentationBinder to bind the filter model.

As a complication, my filter model contains a option to select a single value from a collection of items. This collection is retrieved from a service request and I don't want to keep querying for this data everytime I show the filter, currently I get it if the property is null, and then include the options hidden in the editor template and encoding in the string representation. These options are then reconstituted by the relevant model binder.

Although this approach works I can't help but feel that I am having to basically reinvent viewstate in order to maintain my filter and the included options. As I am new to ASP.NET MVC but am very happy with classic ASP and ASP.NET Web Forms I thought I'd throw this out there for comment and guidance as to find a way which more closely fits with the MVC pattern.

Answer 1

I made this once, very simple.

pseudo code:

Controller

[HttpGet]
public ActionResult getList(int? id){
    return PartialView("Index", new ListViewModel(id??0))
}

ViewModel

public class ListViewModel{
//ObjectAmountPerPage is the amount of object you want per page, you can modify this as //parameter so the user
//can choose the amount

public int ObjectAmountPerPage = 20 //you can make this into a variable of any sort, db/configfile/parameter

public List<YourObjectName> ObjectList;
public int CurrentPage;
    public ListViewModel(id){
        Currentpage = id;
        using (MyDataContext db = new MyDataContext()){
            ObjectList = db.YourObjectName.OrderBy(object=>object.somefield).getListFromStartIndexToEndIndex(id*ObjectAmountPerPage ,(id*ObjectAmountPerPage) +20).toList();
        }
    }
}

Now Create A RenderPartial:

PartialView

<@page inherit="IEnumerable<ListViewMode>">
<%foreach(YourObjectName object in Model.ObjectList){%>
 Create a table with your fields
<%}%>

And create a view that implements your Jquery, other components+your partialView

View

<javascript>
    $(function(){
        $("#nextpage").click(function(){
          (/controller/getlist/$("#nextpage").val(),function(data){$("#yourlist").html = data});
        });
    });
</javascript>
<div id="yourlist">
    <%=Html.RenderPartial("YourPartialView", new ListViewModel())%>
</div>
<something id="nextpage" value"<%=Model.CurentPage+1%>">next page</something>

I hope this helps, this is according to the MVC- mv-mv-c principle ;) Model-View -(modelview) - control