14 Star 36 Fork 8

蓝色天空 / bootstrap-treegrid

加入 Gitee
与超过 600 万 开发者一起发现、参与优秀开源项目,私有仓库也完全免费 :)
免费加入
克隆/下载
取消
提示: 由于 Git 不支持空文件夾,创建文件夹后会生成空的 .keep 文件
Loading...
README.md

功能:依赖bootstrap-table实现treegrid,

内容:

  •   1、支持自定义收缩、展开图标;
  •   2、支持自定义父级ID传入,默认ParentId;
  •   3、父级ID最顶层改为0;
  •   4、修改最后子级前的小图标;
  •   5、支持展开、收缩事件;

用法:

<script src="./bootstrap/js/bootstrap.min.js"></script>
<script src="./bootstrap-table/bootstrap-table.min.js"></script>
<script src="./src/bootstrap-treegrid.min.js"></script>

$('#tb').bootstrapTable({
        method: 'post',
        url: '/HR/HrDept/GetList',
        singleSelect: true,//单行选择
        clickToSelect: true,//点击行时自动选择
        striped: true,//是否显示行间隔色
        treeView: true,//是否显示树形视图
        treeId: "DeptID",//定义关键字段来标识树节点
        treeField: "DeptName",//定义树节点字段
        treeParentId: "MasterID", //定义父级ID字段
        treeRootLevel: 1,//树根的级别
        treeCollapseAll: false,//是否全部折叠,默认折叠 
        uniqueId: "DeptID", //每一行的唯一标识,一般为主键列
        columns:
        [
          { field: 'ck', checkbox: true },
          { field: 'DeptID', title: '机构ID'},
          { field: 'MasterID', title: '上级ID', visible: false },
          { field: 'DeptName', title: '机构名称' }
        ]
       });
  • 注意事项:暂无

效果图

效果图

*有用户反馈九级后不再缩进,我试了一下未发现这个问题呀,截图如下: 多级机构

点评 ( 11 )

你可以在登录后,发表评论

简介

基于bootstrap3.X实现的treegrid树形表格插件,支持自定义ID,父级ID,是否层叠选中子级等功能 展开 收起
JavaScript
MIT
取消

发行版

暂无发行版

bootstrap-treegrid

贡献者

全部

近期动态

加载更多
不能加载更多了
JavaScript
1
https://gitee.com/lds2013/bootstrap-treegrid.git
git@gitee.com:lds2013/bootstrap-treegrid.git
lds2013
bootstrap-treegrid
bootstrap-treegrid
master

搜索帮助

105716 1d94204e 1850385 105716 2d26be5c 1850385