jqGrid local data within ajax

Question

Hello stackoverflow nation ! I've such a snag. Trying to pass in jqGrid array data which is retrieved within ajax, but it doesn't work. lets take a look at script =>

$(function(){ // this script works just fine (of course this array and jqGrid initialization script is in the same file)
var arr = [
    {a:"a",b:"b"},
    {a:"c",b:"d"}
];
$("#_tb").jqGrid({
    datatype: "local",
    data: arr,
    colNames: ["ONE","Two"],
    colModel: [
        {name:"a",index:"a",align:"center"},
    {name:"b",index:"b",align:"center"}
    ],
    pager: $("#_pager"),
    height: "auto"
});
});

here is my problem =>

$.ajax({
    url: "../info.php",
    type: "get",
    data: {},
    success: function(r){
        $("#_tb").jqGrid({
        datatype: "local",
        data: r,
        colNames: ["ONE","Two"],
        colModel: [
            {name:"a",index:"a",align:"center"},
            {name:"b",index:"b",align:"center"}
        ],
        pager: $("#_pager"),
        height: "auto"
        });
    }
    });

this script doesn't work , but data is successfully retrieved within ajax into json format. here is info.php script by the way too

// using PDO for connection
foreach($con->query("SELECT * FROM tb") as $row){
    $info[] = array(
        "a" => $row["a"],
        "b" => $row["b"]
    );
}
echo json_encode($info);

PS. In my opinion my problem is connected to datatype , but can't made up my mind how to solve that despite of searching examples like that . Also remarkable is that I want datatype to be local , because of searching and filtering data in jqGrid without any SQL where statements. With any advice I'll be pleased , thanks :)

If you want to use your current code you should probably add additional parameters of `jQuery.ajax` like `dataType: "json"` or `contentType: "application/json"`. If you will use wrong parameters the type of `r` parameter in the `success` callback could be `string` instead of array of objects. So could could be require to convert `r` to object manually by call of `$.parseJSON(r)`. — Oleg, Nov 07 '12 at 06:37
@Oleg thanks for advices. So in second example where I'm trying to retrieve information from server and add in into jqGrid as a local it is possible if I'll convert it yes :) ? — nanobash, Nov 07 '12 at 07:06

score 2 · Accepted Answer · edited May 23 '17 at 11:56

Sorry, but the code which you posted do work: see the demo:

enter image description here

So you should search for the problem in another place.

One possible problem for example could be that you execute the code multiple times. You should create grid once and then change the data by changing the value of data parameter and trigger reloadGrid. By the way you can use url: "../info.php" directly in the jqGrid. You need just add the corresponding jsonReader (see here). To be able to use local filtering you need just add loadonce: true to the list of jqGrid parameters. Alternatively you can call GridUnload method every time before recreating the grid (see the answer for exmaple).

jqGrid local data within ajax

1 Answers1