zoukankan      html  css  js  c++  java
  • 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>
  • 相关阅读:
    java中变量命名和引用变量的一个坑
    java(2)之前往对象村
    java的print,printf,println以及输入
    HTML学习开篇
    今后的学习路径
    offline .net3.5
    java
    两个经典的Oracle触发器示例(轉)
    listview1
    Delphi连接Oracle控件ODAC的安装及使用(轉載)
  • 原文地址:https://www.cnblogs.com/chenaiiu/p/12262192.html
Copyright © 2011-2022 走看看