[
  {
    "email": "ww@ww.com",
    "name": "ww",
    "password": "qLfsebHMKv7dNgExtR",
    "active": false,
    "role": "admin",
    "createdAt": "2013-10-22T11:48:32.719Z",
    "updatedAt": "2013-10-22T11:48:32.719Z",
    "id": "52666610a6a311308b000001"
  },
  {
    "email": "qq@qq.com",
    "name": "QQ",
    "password": "twfubGHoQkYDVup",
    "active": true,
    "role": "expert",
    "createdAt": "2013-10-22T11:38:47.578Z",
    "updatedAt": "2013-10-22T11:38:47.578Z",
    "id": "526663c788101c9f89000001"
  }
]

and this is my js:

$(function () {
    $('#list').jqGrid({
      url: '/api/v1/users',
      datatype: 'json',
      mtype: 'GET',
      colNames: ['id','email','name', 'password', 'active','role','createdAt','updatedAt'],
      colModel: [
      { name: 'id', width: 80 },
      { name: 'email', width: 80 },
      { name: 'name', width: 80, align: 'right' },
      { name: 'password', width: 80, align: 'right' },
      { name: 'active', width: 80, align: 'right' },
      { name: 'role', width: 80, align: 'right' },
      { name: 'createdAt', width: 80, align: 'right' },
      { name: 'updatedAt', width: 80, sortable: false }
      ],
      pager: '#pager',
      rowNum: 10,
      rowList: [10, 20, 30],
      viewrecords: true,
      gridview: true,
      autoencode: true,
      caption: 'My first grid',
    }); 
  }); 

I could not get that to work at all.

I added: 

  loadComplete: function (data) {
    console.log("OK");
    console.log(data);
  },
  loadError: function (jqXHR, textStatus, errorThrown) {
    console.log('HTTP status code: ' + jqXHR.status + 'n' +
    'textStatus: ' + textStatus + 'n' +
    'errorThrown: ' + errorThrown);
    console.log('HTTP message body (jqXHR.responseText): ' + 'n' + jqXHR.responseText);
  }

loadComplete always returns OK, however, data is an empty array []. What am I missing here?

Update 1:

I inspected the request jqGrid sends and it apear it appends this to my API: 

When I hit this url it does return that empaty array. Any idea how to change this behaviour?