zoukankan      html  css  js  c++  java
  • JQueryEasyUI学习笔记(十五)异步tree(附源码)

    欢迎大家转载,转载请注明出处!

    希望这个笔记对自己和大家有用,但是本人水平有限,如果出错的地方,希望大家指出,多多批评,谢谢!

    今天是easyui的Tree框架的点击展开时的异步加载和全部直接加载:

        <script type="text/javascript">
            $(function () {
                $("#tt2").tree({//异步点击展开Tree
                    url: 'GetTreeMenu.ashx'
                });
                $("#tt").tree({//Tree直接展开
                    url: 'GetTreeMenu.ashx',
                    onLoadSuccess: function(node,data) {//加载成功后调用事件
                        var tree = $(this);
                        if (data) {
                            $(data).each(function(index,d) {
                                if (this.state=='closed') {
                                    tree.tree('expandAll');
                                }
                            });
                        }
                    }
                });
            });
        </script>
    <body>
        <ul id="tt2"></ul>
        <ul id="tt"></ul>
    </body>

    每次点击展开tree的节点的时候,向后台传递的是tree的id,这样我们就可以根据id查处他的子节点,首次加载的时候id为null,这样我们做个判断,直接加载根节点就好

    其中在异步加载时,只要数据库设计清晰,json数据正确,实现起来十分简单

    数据库设计图例:

     

    这样就可以实现异步tree和直接展开tree的方法了,我在写demo的时候,设计的不是很好,所以无论是子节点还是父节点,都有展开的箭头,做个处理就好了

     非常时期,大家多多注意身体

    源码下载 

  • 相关阅读:
    MySQL-索引
    MySQL-存储引擎
    MySQL-基本概念
    Elasticsearch-分片原理2
    Elasticsearch-分片原理1
    [NOIP模拟33]反思+题解
    [NOIP模拟测试32]反思+题解
    [NOIP模拟测试31]题解
    [jzoj5840]Miner 题解(欧拉路)
    [NOIP模拟测试30]题解
  • 原文地址:https://www.cnblogs.com/y20091212/p/3023209.html
Copyright © 2011-2022 走看看