jqgrid загружает данные json с сервера в древовидную сетку, не отображает данные

Я новичок в jqGrid, и я построил jqGrid treeGrid с локальными данными, и все в порядке. Но теперь я пытаюсь сделать то же самое с удаленными данными JSON, и я не могу заставить treeGrid отображать мои данные. Вот конфигурация treeGrid:

$("#"+subgrid_table_id).jqGrid({ 
    url:"sg511e.php?id="+row_id+"&btr="+btr, 
    datatype:"json",
    mType:'POST',
    loadui: "disable",
    colNames:['id','Prestations'],
    colModel:[
        {name:'id',index:'id',width:100,hidden:true},
        {name:'name',index:'name',width:785,sortable:false}
    ],
    pager: pager_id, 
    sortname: 'id', 
    sortorder: "asc", 
    hiddengrid:true,
    gridview: true,
    treeGrid:true,
    treeGridModel: "adjacency",
    treedatatype: 'json',
    ExpandColumn: 'name',
    jsonReader: {
        repeatitems: false,
        root: "rows"
    },

и данные JSON:

{
    "page": 1,
    "total": 1,
    "records": 1,
    "rows": [
        {
            "cell": {
                "id": "1",
                "name": "ECHANGEUR",
                "level": "0",
                "parent": "",
                "isLeaf": true,
                "expanded": false,
                "loaded": true
            }
        },
        {
            "cell": {
                "id": "1_1",
                "name": "Intervention Aller sur Site",
                "level": "1",
                "parent": "1",
                "isLeaf": true,
                "expanded": false,
                "loaded": true
            }
        },
        {
            "cell": {
                "id": "1_1_1",
                "name": "Date et heure d'arrivée sur le site",
                "level": "2",
                "parent": "1_1",
                "isLeaf": false,
                "expanded": true,
                "loaded": true
            }
        },
        {
            "cell": {
                "id": "1_1_2",
                "name": "Consignation de l'échangeur",
                "level": "2",
                "parent": "1_1",
                "isLeaf": false,
                "expanded": true,
                "loaded": true
            }
        }
    ]
}

Я не понимаю, в чем ошибаюсь, поэтому надеюсь, что вы поможете и объясните мою ошибку. Заранее большое спасибо JiheL


json jqgrid treegrid
person JiheL    schedule 04.03.2013    source источник

Ответы (1)


arrow_upward
5
arrow_downward

Прежде всего, вы должны исправить данные JSON:

  • заменить "parent": "" на "parent": "null" в корневом элементе
  • вы должны инвертировать значения свойства isLeaf: изменить все значения true на false и изменить все значения false на true
  • вы должны удалить часть "cell" из всех элементов
  • Значение "records": 1 не соответствует 4 элементам данных. Я предполагаю, что правильное значение должно быть "records": 4, но лучше всего будет удалить pager из списка опций сетки. В случае установки любых page, total или records значения не имеет.

Вы можете упростить данные и удалить часть rows из данных JSON. В случае, если нам нужно изменить свойство root для jsonReader на root: function (obj) { return obj; }. В результате вы можете использовать следующие простые данные JSON:

[
    {
        "id": "1",
        "name": "ECHANGEUR",
        "level": "0",
        "parent": "null",
        "isLeaf": false,
        "expanded": false,
        "loaded": true
    },
    {
        "id": "1_1",
        "name": "Intervention Aller sur Site",
        "level": "1",
        "parent": "1",
        "isLeaf": false,
        "expanded": false,
        "loaded": true
    },
    {
        "id": "1_1_1",
        "name": "Date et heure d'arrivée sur le site",
        "level": "2",
        "parent": "1_1",
        "isLeaf": true,
        "expanded": true,
        "loaded": true
    },
    {
        "id": "1_1_2",
        "name": "Consignation de l'échangeur",
        "level": "2",
        "parent": "1_1",
        "isLeaf": true,
        "expanded": true,
        "loaded": true
    }
]

Демо демонстрирует результаты изменений. После расширения сетка выглядит как на картинке ниже

введите здесь описание изображения

Код, который я использовал в демо:

$("#grid").jqGrid({
    url: "user2132268.json",
    datatype: "json",
    colNames: [ 'id', 'Prestations'],
    colModel: [
        {name: 'id', width: 100, key: true, hidden: true},
        {name: 'name', width: 785, sortable: false}
    ],
    sortname: 'id',
    sortorder: "asc",
    hiddengrid: true,
    gridview: true,
    treeGrid: true,
    treeGridModel: "adjacency",
    ExpandColumn: 'name',
    ExpandColClick: true,
    jsonReader: { repeatitems: false, root: function (obj) { return obj; } },
    height: "auto"
});
person Oleg    schedule 04.03.2013
comment
Большое спасибо за вашу любезную помощь, это прекрасно! Далеко, чтобы стать экспертом в jqGrid, но я работаю над этим! Джихел - person JiheL; 05.03.2013
comment
@user2132268: Добро пожаловать! Вы можете пометить ответ как принятый, если проблема уже решена. - person Oleg; 05.03.2013