Question

I am looking at a jqGrid implementation example for a ASP.NET MVC project. But I couldn’t figure out where are those parameters in a this code come from?

/// <summary>
/// Editing product
/// </summary>
/// <param name="postData">postData collection</param>
/// <returns>json data</returns>
[AcceptVerbs(HttpVerbs.Post)]
public ActionResult EditProduct(FormCollection postData)
{
     //Editing product based on postData
     Product product = _repository.GetProduct(Convert.ToInt32(postData["id"]));
     product.ProductName = postData["ProductName"];
     product.SupplierID = Convert.ToInt32(postData["Supplier"]);
     product.CategoryID = Convert.ToInt32(postData["Category"]);
     product.QuantityPerUnit = postData["QuantityPerUnit"];
     product.UnitPrice = Convert.ToDecimal(postData["UnitPrice"].Replace(".", CultureInfo.CurrentCulture.NumberFormat.NumberDecimalSeparator));
     product.UnitsInStock = Convert.ToInt16(postData["UnitsInStock"]);

     //Sending changes back to repository
     bool success = true;
     try
     {
          _repository.SubmitChanges();
     }
     catch (Exception ex)
     {
          Debug.Write(ex.Message);
          success = false;
     }

    //Returning data - we can hadle this data in form afterSubmit event
    return Json(success);
}

And here is related HTML code;

 <script type="text/javascript">
        $(document).ready(function() {
            $('#jqgProducts').jqGrid({
                //url from wich data should be requested
                url: '/Home/ProductsGridData/',
                //type of data
                datatype: 'json',
                //url access method type
                mtype: 'GET',
                //columns names
                colNames: ['ProductID', 'ProductName', 'SupplierID', 'CategoryID', 'QuantityPerUnit', 'UnitPrice', 'UnitsInStock'],
                //columns model
                colModel: [
                            { name: 'ProductID', index: 'ProductID', align: 'left' },
                            { name: 'ProductName', index: 'ProductName', align: 'left' },
                            { name: 'SupplierID', index: 'SupplierID', align: 'left' },
                            { name: 'CategoryID', index: 'CategoryID', align: 'left' },
                            { name: 'QuantityPerUnit', index: 'QuantityPerUnit', align: 'left' },
                            { name: 'UnitPrice', index: 'UnitPrice', align: 'left' },
                            { name: 'UnitsInStock', index: 'UnitsInStock', align: 'left' }
                            ],
                //pager for grid
                pager: $('#jqgpProducts'),
                //number of rows per page
                rowNum: 10,
                //initial sorting column
                sortname: 'ProductID',
                //initial sorting direction
                sortorder: 'asc',
                //we want to display total records count
                viewrecords: true,
                //grid width
                width: 'auto',
                //grid height
                height: 'auto'
            });
        }); 
</script>
</asp:Content>
<asp:Content ID="cContent" ContentPlaceHolderID="cphContent" runat="server">
    <table id="jqgProducts" cellpadding="0" cellspacing="0"></table>
    <div id="jqgpProducts" style="text-align:center;"></div>
</asp:Content>

The default route is:

routes.MapRoute("Default", "{controller}/{action}", new { controller = "Home", action = "Basics" });

And my question is: Where are these parameters from following request generated?

http://localhost:49290/Home/ProductsGridData/?_search=false&nd=1314749470353&rows=10&page=1&sidx=ProductID&sord=asc

I couldn’t find where parameters “rows”, “page”, “sidx” and “sord” get generated anywhere in the code.

Answer 1

They’re generated by the jQgrid itself. You’ve told it to use a pager, and as such it’s passing pager query strings back to the actionstring in order to get the data it needs. How else would your app know that it only wants 10 rows starting at a certain page?