Question

I am using JQGrid with the Trirand.Web.Mvc class, and trying to figure out how to do custom paging.

I have seen the paging demos here

The problem with these demos is that they bind directly to a linq context object and lets MVC take care of the paging.

    // This method is called when the grid requests data. You can choose any method to call        
    // by setting the JQGrid.DataUrl property        
    public JsonResult PerformanceLinq_DataRequested()        
    {            
        // Get both the grid Model and the data Model            
        // The data model in our case is an autogenerated linq2sql database based on Northwind.            
        var gridModel = new OrdersJqGridModel();            
        var northWindModel = new NorthwindDataContext();            
        // return the result of the DataBind method, passing the datasource as a parameter            
        // jqGrid for ASP.NET MVC automatically takes care of paging, sorting, filtering/searching, etc
        return gridModel.OrdersGrid.DataBind(northWindModel.OrdersLarges);        
    }    

The data set I want to bind to is quite complex and I am returning it from a stored procedure, which does the paging for me.

So all I have to give JQGrid is the correct size of rows for a specific page of the entire resultset. I can also return the total row count.

So I have my results in a List myListOfObjects.

I can pass this into the DataBind using myListOfObjects.AsQueryable()

The problem is, JQGrid thinks there is only {page size} rows, so does not display any of the paging options.

Is it possible to pass in the total row count?

Other grids, like Teleriks MVC grid allows you to pass in the Total row count, and it displays the paging correctly

Answer 1

Ok, so I’ve managed to solve this myself. There may be other ways to do it, if so I’d love to hear them!

The JQGrid.DataBind produces an JsonResult object, whose Data value is set to Trirands own object Trirand.Web.Mvc.JsonResponse

It’s an internal class to their Trirand.Web.Mvc, so i had to copy its structure which I could see using Visual Studio debugging.

It has:

• page – the current page number
• records – the total record count
• rows – of type Trirand.Web.Mvc.JsonRow (which I need to replicate too)
• total – the total number of pages needed

JsonRow looks like:

• cell – a string array of your columns
• id – your row ID

So my code looked like this:

var jsonList = new List<JSONRow>();
myData.ForEach(x => jsonList.Add(new JSONRow(x)));

var jsonResult = Json (new
                            {
                                page = page,
                                rows = jsonList.ToArray(),
                                records = totalRows,
                                total = Math.Round((double)totalRows / rows, MidpointRounding.AwayFromZero)
                            }, JsonRequestBehavior.AllowGet);


   return jsonResult;

My JsonRow looks like this:

public class JSONRow
        {
            public string[] cell { get; set; }
            public string id { get; set; }

            public JSONRow(MyObjectType myObject)
            {
                id = myObject.id;
                cell = new string[3];
                cell[0] = myObject.Col1;
                cell[1] = myObject.Col2?? "";
                cell[2] = myObject.Col3?? "";

            }
        }