title: jqgrid with web api not getting populated
body: <p>I am very new to jqGrid. I am trying to load simple jqgrid using asp.net web api.
  The api send back the list of emailDto. The emailDto is plain class with 3 public properties</p>
  
  <p>The problem is the jqgrid is not getting populated. Any help is very much appreciated.</p>
  
  <pre><code>function dataBindToGrid() {
          var lastsel;
          $("#emailgrid").jqGrid({
              url: '/api/email/',
              datatype: "json",
              mytype: 'GET',
              ajaxGridOptions: { contentType: 'application/json; charset=utf-8' },
              colNames: ['Address ID', 'Type', 'Email'],
              colModel: [{ name: 'Address_ID', width: 70, primaryKey: true, editable: false, sortable: false, hidden: false, align: 'left' },
                      { name: 'Email_Type', width: 70, editable: true, align: 'left', sortable: false },
                      { name: 'Email_Address', width: 200, editable: true, align: 'left', sortable: false }
  
              ],
              onSelectRow: function (id) {
                  if (id &amp;&amp; id !== lastsel) {
                      var grid = $("#emailgrid");
                      grid.restoreRow(lastsel);
                      grid.editRow(id, true);
                      lastsel = id;
                  }
              },
              //This event fires after all the data is loaded into the grid
              gridComplete: function () {
                  //Get ids for all current rows
                  var dataIds = $('#emailgrid').jqGrid('getDataIDs');
                  for (var i = 0; i &lt; dataIds.length; i++) {
                      //Put row in edit state
                      $("#emailgrid").jqGrid('editRow', dataIds[i], false);
                  }
              },
              rowNum: 3,
              viewrecords: true,
              caption: "Email Addresses"
          });
      }
  </code></pre>