Question

Free jqGrid使用以下JSON名称中的数据：值对格式：

var data = {
        "page": "1",
        "records": "3",
        "rows": [
            { "DataID": "1", "DataDesc": "Test 1", "DataTitle": "Test 1" }
        ]
    };

我在PHP脚本中有以下内容：

$i=0; 
while ($row = mysql_fetch_assoc($result)) {
      $data->rows[$i]['cell']=array($row); 
      $i++;
}
print json_encode($data);

返回：

{"rows":[{"cell":[{"user_id":"00082563","first_name":"Peter","case_title":"Male with STI (urethritis)","case_started":"2017-06-02 10:52:10"}]}]}

看起来没问题。但是，使用下面代码的JSON部分，网格根本不显示。

    function loadFirstGrid() {
        $("#FirstGrid").jqGrid({
            url: "scripts/json_test.php?user=" + user,
            dataType: "json",
            mtype: "GET",
            postData: {
                json: JSON.stringify(data)
            },
            colModel: [{
        name: "user_id",
        label: "User ID",
        width: 120
    },
    {
        name: "first_name",
        label: "Name",
        width: 400
    },
    {
        name: "case_title",
        label: "Case Title",
        width: 500
    },
    {
        name: "case_started",
        label: "Case Started",
        width: 200
    },
],
            emtyrecords: "Nothing to display",
            viewrecords: true,
            sortable: true,
            shrinkToFit: false,
            autowidth: true,
            caption: 'First Grid'
        });
    }

但是如果我删除postData部分以获得以下内容，则会显示网格，但当然没有数据。

  function loadFirstGrid() {
    $("#FirstGrid").jqGrid({
        url: "scripts/json_test.php?user=" + user,
        dataType: "json",
        mtype: "GET",
        colModel: [{...

有什么想法吗？

Answer 1

首先，JavaScript是区分大小写的语言，jqGrid将忽略参数dataType: "json"。您应该将其修改为datatype: "json"。

秒，您使用JSON数据的奇异格式：

{
    "rows": [{
        "cell": {
            "user_id": "00082563",
            "first_name": "Peter",
            "case_title": "Male with STI (urethritis)",
            "case_started": "2017-06-02 10:52:10"
        }
    }]
}

而不是

{
    "rows": [ {
        "user_id": "00082563",
        "first_name": "Peter",
        "case_title": "Male with STI (urethritis)",
        "case_started": "2017-06-02 10:52:10"
    }]
}

或

[ {
    "user_id": "00082563",
    "first_name": "Peter",
    "case_title": "Male with STI (urethritis)",
    "case_started": "2017-06-02 10:52:10"
}]

您没有使用loadonce: true并且不清楚，您是否计划实施服务器端分页，数据排序和过滤，或者您希望立即返回所有数据而jqGrid应该使用客户端分页，排序和过滤。

最后，您应该使用name的{{1}}属性与colModel的属性相对应。理解这一点非常重要，jqGrid必须为网格的每一行分配唯一的user_id（请参阅here）。因此，您必须通知jqGrid，哪个属性包含rowid。您可以使用id或在jsonReader: { id: "user_id" }列中添加属性key: true。

演示https://jsfiddle.net/OlegKi/qgrwymuu/1/包含上述修改的示例。它使用JSFiddle的Echo服务来模拟服务器，它使用一些JSON数据进行响应。

Answer 2

好的，终于解决了这个问题并使用了这个

function loadFirstGrid() {
    $("#FirstGrid").jqGrid({
         url: "scripts/json_test.php?user=" + user,
        dataType: "json",
        mtype: "GET",
      colModel: [
            {name: "user_id", label:"User ID", width: 120},
            {name: "first_name", label:"Name", width: 400},
            {name: "case_title", label:"Case Title", width: 500},
            {name: "case_started", label:"Case Started", width: 200},
        ],
        emtyrecords: "Nothing to display",
        viewrecords: true,
        sortable: true,
        shrinkToFit: false,
        autowidth: true,
        caption: 'First Grid',
    });
}

为jqGrid获取正确的格式JSON：

{"page":"1","total":"1","records":"1","rows":[{"user_id":"00082563","first_name":"Peter","case_title":"Male with STI (urethritis)","case_started":"2017-06-02 10:52:10"}]}

我使用了以下PHP脚本：

$page = '1';
$total_pages = '1';
$count = '1';

$data = (object) array('page' => $page, 'total' => $total_pages, 'records' =>$count, 'rows' => "");

  $data->page = $page;
  $data->total = $total_pages;
  $data->records = $count;

$i=0; 
while ($row = mysql_fetch_assoc($result)) {
      $data->rows=array($row); 
      $i++;
}
print json_encode($data);
?>

（注意：我不关心页数，total_pages和count，因为我的网格只有一个主记录和多个只有一个记录的子网格）。希望这有助于某人;文档或示例中没有太多描述如何使用Free jqGrid执行此操作; - （

免费的jqGrid - 使用PHP的JSON编码示例

2 个答案: