How to bind a JsonResult object to jqgrid?

Question

I have the following method in the controller which I call from my view to populate a jqgrid. This method works fine and returns data.

public JsonResult _FirstLook()
{
    HttpResponseMessage response;

    response = client.GetAsync("api/CasoAdverso").Result;
    if (response.IsSuccessStatusCode)
        {
            IEnumerable<CasoAdverso> list = response.Content.ReadAsAsync<IEnumerable<CasoAdverso>>().Result;

            return Json(list);
        }
}

If I debug what is being returned the structure would be like the picture below. The list of objects is in Data:

enter image description here

I will summarize the CasoAdverso class because it's quite big for putting it here:

public class CasoAdverso
{
    public int CAAD_Id { get; set; }
    public string CAAD_Id_Local { get; set; }
    public System.DateTime? CAAD_Fecha_Contacto { get; set; }
}

The jqgrid actually receives data to populate but somehow is not being displayed:

$(grid_selector).jqGrid({
datatype: "json",
height: 250,
mType: 'GET',
url: "@Url.Action("_FirstLook", "CasoAdversoForm")", 
colNames: ['ID', 'ID Caso', 'Fecha Contacto Notif.'],
        colModel: [
            {   name: 'CAAD_Id', index: 'CAAD_Id', key: true },
            {   name: 'CAAD_ID_Local', index: 'CAAD_ID_Local', width: 60, editable: false },
            {  name: 'CAAD_Fecha_Contacto', index: 'CAAD_Fecha_Contacto', width: 90, editable: false, sorttype: "date", unformat: pickDate },
        ],
  ...
        },

I'm aware that the solution might come through the jsonReader in jqgrid but I couldn't make any progress without totally changing my _FirstLook method in the controller.

In my scenario I would need to change the jqgrid to bind what I'm currently getting from the controller. It would be good not having to do some workaround in the controller to give the jqgrid what he needs by default.

Please define "bind": what is the expect behavior? How does it differ from the actual behavior? — Saturnix, Nov 29 '13 at 00:44
In this case the binding would be setting the jsonReader which will "link" the structure that the grid expects with the structure of the JsonResult object. The expected behaviour would be populating and displaying but this is not happening... — Javier, Nov 29 '13 at 01:19
There is an example of the jsonreader here: http://stackoverflow.com/questions/14748169/jqgrid-jsonreader-configuration — Javier, Nov 29 '13 at 01:19

score 2 · Answer 1 · answered Nov 29 '13 at 07:02

I suppose that the main reason of the described problem isn't "binding". You use mType: 'GET' option which will be ignored because the option with the name mType is not exist. So the default option value mtype: 'GET' (mtype instead of mtype) will be used. So you should either use mtype: 'POST' or replace the line

return Json(list);

to

return Json(list, JsonRequestBehavior.AllowGet);

Additionally I would recommend you to verify that you use loadonce: true option because you don't implemented server side paging in your server code. I recommend you additionally to use gridview: true, autoencode: true options and consider to use height: "auto" instead of height: 250.

How to bind a JsonResult object to jqgrid?

1 Answers1