1

I've successfully bind data to JqGrid using ASP.NET MVC 2. I followed an example code to achieve it. Below is my code and i've got some questions regarding the code.

  1. I can not see the parameter passing to "string sidx, string sord, int page, int rows" in my jquery code?

  2. Do i need to have the exactly same names in my model? i mean total,page,records,rows can these properties be changed or JQgrid require the same property names?

Model:

public class JQGrid
    {
        public int total { get; set; }
        public int page { get; set; }
        public int records { get; set; }
        public Array rows { get; set; }
    }

Repository:

public JQGrid DynamicGridData(string sidx, string sord, int page, int rows)
        {

            dc = new StockDataClassesDataContext(ConString.DBConnection);

            int pageIndex = Convert.ToInt32(page) - 1;
            int pageSize = rows;
            int totalRecords = dc.tblClients.Count();
            int totalPages = (int)Math.Ceiling((float)totalRecords / (float)pageSize);

            var GridData = new JQGrid
            {
                total = totalPages,
                page =page,
                records = totalRecords,
                rows = (
                    from client in dc.tblClients
                    select new 
                    {
                        i = client.ClientID,
                        cell = new string[] { client.ClientID.ToString(), client.Address.ToString(), client.Company.ToString(), client.Name.ToString() }
                    }).ToArray()
            };

            return GridData;
        }

Controller:

public ActionResult DynamicGridData(string sidx, string sord, int page, int rows)
        {
            JqGridClientRepository rep = new JqGridClientRepository();
            var jsonData = rep.DynamicGridData(sidx, sord, page, rows);

            return Json(jsonData, JsonRequestBehavior.AllowGet);
        }

View:

<asp:Content ID="Content2" ContentPlaceHolderID="MainContent" runat="server">
 <title>jqGrid for ASP.NET MVC - Demo</title>
    <!-- The jQuery UI theme that will be used by the grid -->    
    <link rel="stylesheet" type="text/css" media="screen" href="http://ajax.aspnetcdn.com/ajax/jquery.ui/1.10.0/themes/redmond/jquery-ui.css" />
    <!-- The Css UI theme extension of jqGrid -->
    <link rel="stylesheet" type="text/css" href="../../Content/themes/ui.jqgrid.css" />    
    <!-- jQuery library is a prerequisite for jqGrid -->
    <script src="http://ajax.microsoft.com/ajax/jquery/jquery-1.9.0.min.js" type="text/javascript"></script>
    <!-- language pack - MUST be included before the jqGrid javascript -->
    <script type="text/javascript" src="../../Scripts/trirand/i18n/grid.locale-en.js"></script>
    <!-- the jqGrid javascript runtime -->
    <script type="text/javascript" src="../../Scripts/trirand/jquery.jqGrid.min.js"></script>  

    <script type="text/javascript">
        $(function () {
            $("#list").jqGrid({
                url: '/JqGridClients/DynamicGridData/',
                datatype: 'json',
                mtype: 'GET',
                colNames: ['ClientID', 'Address', 'Company','Name'],
                colModel: [
          { name: 'ClientID', index: 'ClientID',width: 60, align: 'left' },
          { name: 'Address', index: 'Address', align: 'left' },
          { name: 'Company', index: 'Company', align: 'left' },
          { name: 'Name', index: 'Name', align: 'left'}],
                pager: jQuery('#pager'),
                rowNum: 10,
                rowList: [5, 10, 20, 50],
                sortname: 'ClientID',
                sortorder: "desc",
                viewrecords: true,
                imgpath: '/scripts/themes/coffee/images',
                caption: 'Clients'
            });
        }); 
    </script>  

    <h2>Index</h2>

<table id="list" class="scroll" cellpadding="0" cellspacing="0"></table>
<div id="pager" class="scroll" style="text-align:center;"></div>

</asp:Content>
chamara
  • 12,649
  • 32
  • 134
  • 210
  • It seems that you use **very old** code example as the template. Look at [the answer](http://stackoverflow.com/a/5501644/315935), [this one](http://stackoverflow.com/a/9349688/315935) or [this one](http://stackoverflow.com/a/7392816/315935) which all provides demo Visual Studio projects for download. You current code includes errors line `i = client.ClientID` instead of `id = client.ClientID`, it uses `imgpath` which is deprecated since 3 year and so on. – Oleg May 11 '13 at 08:43

0 Answers0