2017-06-04 99 views
0

一下周围的环境:jqGrid的5.1,PHP 5.3的jqGrid的TreeGrid数据格式

我的数据:

{ 
"values": [ 
    { 
     "id": "1", 
     "mac": "64:09:80:57:A6:EE", 
     "username": "WIFI-DQ", 
     "company": "Xiaomi Communications Co Ltd", 
     "isLeaf": false, 
     "expanded": true, 
     "level":0, 
     "p_id": "0" 
    }, 
    { 
     "id": "2", 
     "mac": "F0:B4:29:5A:B5:0F", 
     "username": "1001", 
     "company": "Tenda Technology Co., Ltd.", 
     "isLeaf": false, 
     "expanded": true, 
     "level":0, 
     "p_id": "0" 
    }, 
    { 
     "id": "3", 
     "mac": "64:09:80:57:A6:EF", 
     "username": "WIFI-DQ_5G", 
     "company": "TP-LINK TECHNOLOGIES CO.,LTD.", 
     "isLeaf": false, 
     "expanded": true, 
     "level":0, 
     "p_id": "0" 
    }, 
    { 
     "id": "4", 
     "mac": "00:1C:BF:8B:DF:8E", 
     "username": "QCL16", 
     "company": "Intel Corporate", 
     "isLeaf": true, 
     "expanded": true, 
     "level":1, 
     "p_id": "2" 
    }, 
    { 
     "id": "5", 
     "mac": "98:2F:3C:07:56:36", 
     "username": "admin23", 
     "company": "Xiaomi Communications Co Ltd", 
     "isLeaf": true, 
     "expanded": true, 
     "level":1, 
     "p_id": "2" 
    }, 
    { 
     "id": "6", 
     "mac": "34:80:B3:FC:3F:0B", 
     "username": "Iphone", 
     "company": "Iphone", 
     "isLeaf": true, 
     "expanded": true, 
     "level":1, 
     "p_id": "2" 
    }, 
    { 
     "id": "7", 
     "mac": "35:85:B3:DC:3F:0B", 
     "username": "Lenovo PC", 
     "company": "Iphone", 
     "isLeaf": true, 
     "expanded": true, 
     "level":1, 
     "p_id": "3" 
    } 
], 
"start": 0, 
"limit": 15, 
"end": 15, 
"pageNumber": 1, 
"totalSize": 7, 
"totalPages": 1 

}

我的html:

$('#tree').jqGrid({ 
      "url":"wifi.json", 
      "styleUI" : 'Bootstrap', 
      "colModel":[ 
       { 
        "name":"id", 
        "index":"id", 
        "sorttype":"int", 
        "key":true, 
        "hidden":true, 
        "width":50 
       },{ 
        "name":"username", 
        "index":"username", 
        "sorttype":"string", 
        "label":"Name", 
        "width":170, 
        formatter: function (value, grid, rows, state) { 
         return "test:"+value; 
        } 
       },{ 
        "name":"mac", 
        "index":"mac", 
        "sorttype":"string", 
        "hidden":false, 
        "width":50 
       } 
      ], 
      "width":"600", 
      "hoverrows":false, 
      "viewrecords":false, 
      "gridview":true, 
      "height":"auto", 
      "loadonce":true, 
      "rowNum":100, 
      "scrollrows":true, 
      // enable tree grid 
      "treeGrid":true, 
      // which column is expandable 
      "ExpandColumn":"username",//点击那一列触发展开,收缩操作 
      // datatype 
      "treedatatype":"json", 
      "treeIcons":{plus:'glyphicon-triangle-right',minus:'glyphicon-triangle-bottom',leaf:''},//plus:折叠起来的图标,minus:展开的图标,leaf:没有子节点了的图标 
      // the model used 
      "treeGridModel":"adjacency", 
      "tree_root_level":0, 
      // configuration of the data comming from server 
      "treeReader":{ 
       //"left_field":"id", 
       //"right_field":"id", 
       "level_field":"level",//当前菜单的级别1级菜单,2级菜单.... 
       "parent_id_field": "p_id",//数据里面的父级节点的名称 
       //"leaf_field":"isLeaf", 
       "expanded_field":"expanded",//是否展开子节点 
       //"loaded":"loaded", 
       "icon_field":"icon" 
      }, 
      jsonReader: { 
       root: "values", 
       repeatitems : false 
      }, 
      "sortorder":"asc", 
      "datatype":"json" 
     }); 

我有一个问题,无论是数据需要排序才能显示出来? 测试时间,结果显示为ch aos,请问如何修改? enter image description here

回答

0

了解,目前执行旧的jqGrid的,商业Guriddo jqGrid JS(你目前使用)和free jqGrid假设在输入数据项的具体顺序是非常重要的。节点或叶子必须跟随其父节点

带有4到6的ID的项目包含属性"p_id": "2"。这意味着一个必须将项目放置在之后项目"id": "2"(在项目"id": "2"和项目"id": "3"之间)。它应该解决你所描述的问题。

+0

@ m7lrv:是的。 'wifi.json'应该包含正确排序的数据。 – Oleg

+0

@ m7lrv:不客气!我建议你使用Chrome/IE的开发工具来检查TreeGrid的DOM。你会看到节点/叶子的放置顺序与你包含数据的顺序完全相同(如'wifi.json')。节点的打开/展开只是使网格的某些行可见(从某个“”元素中删除'display:none')。这种实现是TreeGrid项目顺序存在限制的原因。 – Oleg

+0

@ m7lrv:你是新的在stackoverflow。我提醒你,在问题解决后你应该[“接受”](https://meta.stackexchange.com/a/5235/147495)答案。通过接受你会得到你的第一个声望点。 – Oleg