热门标签 | HotTags
当前位置:  开发笔记 > 前端 > 正文

jQueryzTree树插件动态加载实例代码

这篇文章主要介绍了jQueryzTree树插件动态加载效果的实例代码,需要的朋友可以参考下

需求:

  由于项目中家谱图数据量超大,而一般加载方式是通过,页面加载时 zTree.init方法进行数据加载,将所有数据一次性加载到页面中。而在项目中家谱级别又非常广而深,成千上万级,因此一次加载,完全加载不出来。于是需要进行优化为动态加载(增量加载)的方式,以便数据加载,提高体验度。

解决断路:

  这应该好办,只要找到父节点单击事件,然后进行数据加载,结点附加即可。时间紧,任务重,完全没给研究的时间。只能硬着上,随便搜索一个“zTree动态加载”,出是出来了,标题也对,可里面的代码根本没找到添加结点一说……一边是需求催,一边是没找到类似。无语……对啊,不是有官网,于是把所有api函数浏览一遍,终于发现一个叫addNodes的函数。喜!

控件代码

    脚本代码(实现结点展开、单击事件时进行动态加载):

    
    

    其中后端请求:

      其中数据来源为请求路径“/User/NextLeve?userId=xxx”,为返回如下结构的列表的json数据(即List类型的.ToJson()数据),其中userId可为,为空时默认取当前登录用户:

    public class UserNode
    {
      public long id { get; set; }
      public long pId { get; set; }
      public string name { get; set; }
      public bool open { get; set; }
      public bool isParent { get; set; }
      public string icon { get; set; }
    }

    效果,则实现为单击父结点/展开父结点时动态加载子结点。

    以上所述是小编给大家介绍的jQuery zTree树插件动态加载效果实例代码,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对网站的支持!


    推荐阅读
    author-avatar
    虫虫2彡0120106
    这个家伙很懒,什么也没留下!
    PHP1.CN | 中国最专业的PHP中文社区 | DevBox开发工具箱 | json解析格式化 |PHP资讯 | PHP教程 | 数据库技术 | 服务器技术 | 前端开发技术 | PHP框架 | 开发工具 | 在线工具
    Copyright © 1998 - 2020 PHP1.CN. All Rights Reserved | 京公网安备 11010802041100号 | 京ICP备19059560号-4 | PHP1.CN 第一PHP社区 版权所有