2016-09-22 6 views
0

Мой сервер возвращает данные в формате JSON следующим образом:Как загрузить данные в jqGrid TreeGrid

{ 
    "pageIndex": 1, 
    "pageSize": 100, 
    "pages": 290, 
    "total": 2891, 
    "nodes": [ 
    { 
     "data": { "id": 1, "name": "Node 1", "leaf": false }, 
     "errors": [] 
    }, 
    { 
     "data": { "id": 2, "name": "Node 2", "leaf": true, "parentId": 1 }, 
     "errors": [] 
    } 
    ] 
} 

Я хотел бы, чтобы отобразить это в виде иерархической древовидной структуры, так что я настроен jqGrid в режиме TreeGrid следующим образом:

$("#tree").jqGrid({ 
    url: "/tree", 
    datatype : "json", 
    colModel : [{ 
    name: "data.id", 
    key: true 
    }, { 
    name: "data.name" 
    }], 
    colNames : [], 
    jsonReader : { 
    page : 1, 
    records : "total", 
    repeatitems : false, 
    root : "nodes", 
    total : 1 
    }, 
    treeGrid : true, 
    treeGridModel : "adjacency", 
    tree_root_level : 1, 
    ExpandColumn : "data.id", 
    ExpandColClick : true, 
    treeReader : { 
    leaf_field : "leaf", 
    parent_id_field : "data.parentId" 
    } 
}); 

Это прекрасно работает; однако имена столбцов должны быть указаны с префиксом data. Есть ли способ избавиться от этого префикса для имен столбцов без изменения данных, возвращаемых с сервера?

+0

Не могли бы вы включить правильные данные и код, который вы используете? Вы пишете: «Это прекрасно работает», но это не может из-за многих синтаксических ошибок. Данные содержат синтаксическую ошибку: см. Отсутствие запятой после '" pageSize ": 100'. '$ {" # tree ")' вместо '$ (" # tree ")', отсутствует закрытие '}' в конце кода ('});' вместо '}});'), пустой массив 'colNames' вместо использования' colNames' и 'colModel' той же длины, в том числе no' colNames', ... – Oleg

ответ

0

Если я правильно понимаю вашу проблему, то вы должны исправить colModel, jsonReader и treeReader к следующему:

colModel : [{ 
    name: "id", 
    key: true 
}, { 
    name: "name" 
}], 
jsonReader : { 
    cell: "data", 
    root : "nodes" 
}, 
treeReader : { 
    parent_id_field: "parentId", 
    leaf_field : "leaf" 
} 

Смотрите соответствующую демо: https://jsfiddle.net/OlegKi/ae18ov61/2/. Я добавил дополнительно свойство "level": 1 в элемент данных, который описывает лист.