ztree 点击重载 layui table

最新推荐文章于 2024-03-09 21:49:48 发布

qq_38707421

最新推荐文章于 2024-03-09 21:49:48 发布

阅读量548

点赞数 1

分类专栏： php layui ztree 文章标签： jquery

本文链接：https://blog.csdn.net/qq_38707421/article/details/104831123

版权

php 同时被 3 个专栏收录

6 篇文章 0 订阅

订阅专栏

layui

1 篇文章 0 订阅

订阅专栏

ztree

1 篇文章 0 订阅

订阅专栏

ztree 点击重载 layui table

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<HTML>
<HEAD>
  <TITLE> ztree_demo </TITLE>
  <meta http-equiv="content-type" content="text/html; charset=UTF-8">
  <link rel="stylesheet" href="css/zTreeStyle/zTreeStyle.css" type="text/css">
  <link rel="stylesheet" href="https://www.layuicdn.com/layui-v2.5.6/css/layui.css"  media="all">
  <script type="text/javascript" src="jquery.min.js"></script>
  <script type="text/javascript" src="jquery.ztree.core.js"></script>
  <script type="text/javascript" src="query.ztree.excheck.js"></script>
  <script type="text/javascript" src="jquery.ztree.exedit.js"></script>
<script src="layui.js" charset="utf-8"></script>
<script>
layui.use(['table'], function () {
        var table = layui.table,
            $ = layui.jquery,
            layer = layui.layer;

		var re=table.render({
			elem: '#test'
			,url:'/app/mini/index.php?c=base&a=user'
			,cols: [[
			   {field:'NAME', title:'用户名称'}
			  ,{field:'PRIV_NAME', title:'角色'}
			]]
			,page: true
		});
		
	//根据ID重载table  	
    function tableReload(treeId){
		table.reload('test', {
			page: {
			  curr: 1 //重新从第 1 页开始
			}
			,where: {
                ID: treeId
            }
		}, 'data');
	}

    var zTree;
    var demoIframe;
    var setting = {
      view: {
        dblClickExpand: false,
        showLine: true,
        selectedMulti: false
      },
      data: {
        simpleData: {
          enable: true,
          idKey: "id",
          pIdKey: "pid",
          rootPId: ""
        }
      },
      callback: {
        beforeClick: function (treeId, treeNode) {
          var zTree = $.fn.zTree.getZTreeObj("tree");
          if (treeNode.isParent) {
            zTree.expandNode(treeNode);
            return false;
          } else {
            console.log(treeNode.id);
			tableReload(treeNode.id);
            return true;
          }
        }
      }
    };
	
	
	
    $(document).ready(function () {
		$.ajax({
			url:'接口地址',
			type:'POST',
			success:function(data){
				menuNode=$.parseJSON(data); 
				console.log(menuNode);
				var t = $("#tree");
				t = $.fn.zTree.init(t, setting, menuNode);
			}
		})	
    });
	
	
});
  </SCRIPT>
</HEAD>
<style>
html, body{
    width: 100%;
    height: 100%;
}
</style>
<BODY>
<div  style="height=100%;">
 
    <span style="width:15%;float:left">
      <ul id="tree" class="ztree" style="width:460px; overflow:auto;"></ul>
    </span>
	<span style="width:80%;float:left;">
		<table class="layui-hide" id="test" lay-filter="demo"></table>
	</span>
 
</div>

</BODY>
</HTML>

在这里插入图片描述

qq_38707421

关注

1
点赞
踩
1

收藏

觉得还不错? 一键收藏
2
评论
ztree 点击重载 layui table

ztree 点击重载 layui table<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><HTML><HEAD> <TITLE> ztre...
复制链接

扫一扫