简单知识点实例之四:BootstrapTable新型树表格

之前就一直苦恼,为什么没有树形表格,今天无意中看到,很开心,赶紧实验了一下。具体可以查看官网http://issues.wenzhixin.net.cn/bootstrap-table/#extensions/treegrid.html

一、创建url/bootstrap_treegrid.json

[
  {
    "id": 1,
    "pid": 0,
    "name": "系统管理",
    "referred": "管理"
  },
  {
    "id": 2,
    "pid": 0,
    "name": "字典管理",
    "referred": "字典"
  },
  {
    "id": 20,
    "pid": 1,
    "name": "新增系统",
    "referred": "新增"
  },
  {
    "id": 21,
    "pid": 1,
    "name": "编辑系统",
    "referred": "编辑"
  },
  {
    "id": 22,
    "pid": 1,
    "name": "删除系统",
    "referred": "删除"
  },
  {
    "id": 33,
    "pid": 2,
    "name": "系统环境",
    "referred": "环境"
  },
  {
    "id": 333,
    "pid": 33,
    "name": "新增环境",
    "referred": "新增"
  },
  {
    "id": 3333,
    "pid": 33,
    "name": "编辑环境",
    "referred": "编辑"
  },
  {
    "id": 233332,
    "pid": 33,
    "name": "删除环境",
    "referred": "删除"
  }
]
二、具体源码




    
    Title
    
    
    
    
    
    
    
    
    
    
    


    
三、实现效果


四、下载地址:http://download.csdn.net/download/miss_ll/10204307

需要在webstrom此类软件中才能出现数据哦

你可能感兴趣的:(bootstrap)