title: Cannot get JQGrid to show data (From JSON service)
body: <p>I have a proof-of-concept JQGrid I have been playing with, but I cannot get it to show data from a webservice that returns JSON.  I know it is properly hitting my service, because I can set a break-point and watch it get hit while the page is loading.</p>
  
  <p>The Grid renders, and looks good, but no data is ever shown in it.  The code I have for the grid is shown here (I tried to remove all of the complexity that I could):</p>
  
  <pre><code>jQuery("#list4").jqGrid({
          url: 'http://localhost:55555/GetJson',
          datatype: "json",
          colNames: ['-First Name-', '-LastName-'],
          colModel: [
          { name: 'fname', index: 'fname', width: 50},        
          { name: 'lname', index: 'lname', width: 50}
      ],
          caption: "Employees",       
          pager: "#pager2",
          viewrecords: true,
          width: 550
      });     
  jQuery("#list4").jqGrid('navGrid','#pager2',{edit:false,add:false,del:false})
  </code></pre>
  
  <p>My service returns the following JSON (note that I added line breaks for readability):</p>
  
  <pre><code>{"total":5,"page":1,"records":5,"rows":[
  {"id":1,"cell":["Andrew","Smith"]},
  {"id":2,"cell":["Danny","Johnson"]},
  {"id":3,"cell":["Ron","Lewis"]},
  {"id":4,"cell":["George","Washington"]},
  {"id":5,"cell":["Peter","Davis"]}]}
  </code></pre>
  
  <p>Like I said, the grid seems to render properly, and when I try to populate it with an array directly in JS, it populates just fine, but it will NOT read my JSON.  Any ideas?</p>
  
  <p>This is the HTML I tried locally after I read Oleg's post and copied his sample:  It is still not showing any data.</p>
  
  <pre><code>&lt;!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"&gt;
  &lt;html xmlns="http://www.w3.org/1999/xhtml"&gt;
  &lt;head&gt;
      &lt;title&gt;Just simple local grid&lt;/title&gt;
      &lt;meta http-equiv="Content-Type" content="text/html; charset=utf-8" /&gt;
      &lt;link rel="stylesheet" type="text/css" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.11/themes/redmond/jquery-ui.css" /&gt;
      &lt;link rel="stylesheet" type="text/css" href="http://www.ok-soft-gmbh.com/jqGrid/jquery.jqGrid-3.8.2/css/ui.jqgrid.css" /&gt;
      &lt;script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.5.2/jquery.min.js"&gt;&lt;/script&gt;
      &lt;script type="text/javascript" src="http://www.ok-soft-gmbh.com/jqGrid/jquery.jqGrid-3.8.2/js/i18n/grid.locale-en.js"&gt;&lt;/script&gt;
      &lt;script type="text/javascript" src="http://www.ok-soft-gmbh.com/jqGrid/jquery.jqGrid-3.8.2/js/jquery.jqGrid.min.js"&gt;&lt;/script&gt;
      &lt;script type="text/javascript"&gt;
      //&lt;![CDATA[
          $(document).ready(function () {
              jQuery("#list4").jqGrid({
                  url: 'repdetec.json',
                  datatype: "json",
                  colNames: ['-First Name-', '-LastName-'],
                  colModel: [
                      { name: 'fname', index: 'fname', width: 50},
                      { name: 'lname', index: 'lname', width: 50}
                  ],
                  caption: "Employees",
                  pager: "#pager2",
                  viewrecords: true,
                  width: 550
              });
              jQuery("#list4").jqGrid('navGrid','#pager2',{edit:false,add:false,del:false})
          });
      //]]&gt;
      &lt;/script&gt;
  &lt;/head&gt;
  &lt;body&gt;
      &lt;table id="list4"&gt;&lt;tr&gt;&lt;td/&gt;&lt;/tr&gt;&lt;/table&gt;
      &lt;div id="pager2"&gt;&lt;/div&gt;
  &lt;/body&gt;
  &lt;/html
  </code></pre>