css 

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>树级查询</title>
<link rel="stylesheet" href="${pageContext.request.contextPath }/dtree2/layui/css/layui.css">
<script type="text/javascript" src="${pageContext.request.contextPath }/dtree2/layui/layui.js"></script>

<link rel="stylesheet" href="${pageContext.request.contextPath }/dtree2/layui_ext/dtree/dtree.css">
<link rel="stylesheet" href="${pageContext.request.contextPath }/dtree2/layui_ext/dtree/font/dtreefont.css">
</head>

<body>
  <div class="container">
    <div class="layui-row layui-col-space10">
      <div class="layui-fluid">
        <fieldset class="layui-elem-field layui-field-title">
          <legend>在线示例</legend>
            <div class="layui-field-box">
              <div class="layui-row layui-col-space10" style="margin-top: 10px;">
               <div class="layui-col-xs12">
                  <div id="toolbarDiv" style="overflow: auto">
                    <ul id="demoTree" class="dtree" data-id="0"></ul>
                  </div>
               </div>
             </div>
           </div>
         </fieldset>
       </div>
     </div>
   </div>
</body>

<script type="text/javascript">
  layui.extend({
    dtree: '{/}dtree2/layui_ext/dtree/dtree'
  }).use(['element','layer', 'table', 'code' ,'util', 'dtree', 'form'], function(){
    var element = layui.element, layer = layui.layer, table = layui.table, util = layui.util, dtree = layui.dtree, form = layui.form, $ = layui.$;
        
    {
        "status":{"code":200,"message":"操作成功"},
        "data": [{
          "id":"001",
          "title": "湖南省",
          "parentId": "0",
          "checkArr": [{"type": "0", "checked": "0"}],
          "children":[]
        },{
          "id":"002",
          "title": "湖北省",
          "parentId": "0",
          "checkArr": [{"type": "0", "checked": "0"}],
          "children":[]
        },{
          "id":"003",
          "title": "广东省",
          "parentId": "0",
          "checkArr": [{"type": "0", "checked": "0"}],
          "children":[]
        },{
          "id":"004",
          "title": "浙江省",
          "parentId": "0",
          "checkArr": [{"type": "0", "checked": "0"}],
          "children":[]
        },{
          "id":"005",
          "title": "福建省",
          "parentId": "0",
          "checkArr": [{"type": "0", "checked": "0"}],
          "children":[]
        }]
        }

        
    var DTree = dtree.render({
          elem: "#demoTree",
          url: "detree2/json/case/checkbarTree1.json",
          checkbar: true,  
          checkbarType: "all" // 默认就是all，其他的值为： no-all  p-casc   self  only
        });
    
        
    dtree.on("node(demoTree)", function(obj){
      layer.msg(JSON.stringify(obj.param));
    })
  });
</script>
</html>

 

posted @ 2020-02-04 23:55  晨起  阅读(239)  评论(0)    收藏  举报