zoukankan      html  css  js  c++  java
  • zTree第三章,异步加载,前端

    zTree异步加载

    ----------------------------------------------------------------------------------

    具体详见API文档:

    http://www.treejs.cn/v3/api.php 

    ---------------------------------------------------------------------------------- 

    重点是:

    setting里面的async相关属性

    回调函数callBack里面的onAsyncSuccess : ztreeOnAsyncSuccess

    ----------------------------------------------------------------------------------  

    参考文章

    https://blog.csdn.net/u010951692/article/details/51833077

    ----------------------------------------------------------------------------------  

    <div id="treeAdmin" class="ztree"></div>

    ----------------------------------------------------------------------------------

    var setting = {
    async : {
    autoParam : [ "pId" , "floor" ],
    enable : true,
    type : "post",
    url : SITE_PATH + "/resourcePush/getSonNodes",
    dataFilter : filter,
    },
    showLine : true,
    view : {
    nameIsHTML : true,//允许注入html标签
    },
    check : {
    enable : true,
    chkStyle : "checkbox"
    },
    callback : {
    onClick : zTreeOnClick,
    onAsyncSuccess : ztreeOnAsyncSuccess
    }
    };

    ----------------------------------------------------------------------------------

     var treeObj = $.fn.zTree.init($("#treeAdmin"), setting);

    注意没有nodes

    ----------------------------------------------------------------------------------

     一些图片资源

    var file = __THEME__+"resourcesPush/js/ztree/img/diy/file.png", //单个文件
    folder = __THEME__+"resourcesPush/js/ztree/img/diy/folder.png", //未展开文件夹
    folderOpen = __THEME__+"resourcesPush/js/ztree/img/diy/folder_open.png";//展开文件夹

    涉及两个属性

    node.isParent;

    node.open;

    ----------------------------------------------------------------------------------

    function filter(){
    return ;
    }

    function ztreeOnAsyncSuccess(event, treeId, treeNode){
    var url = SITE_PATH + "/resourcePush/getSonNodes";
    var parameter = {};

    if(treeNode == undefined){
    parameter.pId = "0";
    parameter.floor = "0";
    }
    else{
    parameter.pId = treeNode.id;
    parameter.floor = treeNode.floor;
    }
    $.ajax({
    type : "post",
    url : url,
    data : parameter,
    dataType : "json",
    async : true,
    success : function(jsonData) {
    if (jsonData != null) {
    var data = jsonData;
    if(data != null && data.length != 0){
    //添加图标
    data = getIcon(data);
    if(treeNode == undefined){
    treeObj.addNodes(null,data,true);// 如果是根节点,那么就在null后面加载数据
    }
    else{
    treeObj.addNodes(treeNode,data,true);//如果是加载子节点,那么就是父节点下面加载
    }
    }
    treeObj.expandNode(treeNode,true, false, false);// 将新获取的子节点展开
    }
    },
    error : function() {
    console.log("请求错误!");
    }
    });
    };

    ----------------------------------------------------------------------------------

    function getIcon(res){
    if (res) {
    res.forEach(function(data, index, arr) {
    if (data) {
    if (data.iconOpen == "folderOpen") {
    data.iconOpen = folderOpen;
    }
    if (data.iconClose == "folder") {
    data.iconClose = folder;
    }
    if (data.icon == "file") {
    data.icon = file;
    }
    }
    });
    }
    return res;
    }

    ----------------------------------------------------------------------------------

  • 相关阅读:
    简单线程池的设计
    MFC开发--截图工具
    Win32小游戏--蜘蛛纸牌
    C++语言动态创建对象
    C++语言类之间的关系
    c++语言虚函数实现多态的原理(更新版)
    5-24 c++语言之【基础知识】
    小细节--关于printf的输出问题
    Win32小游戏--贪吃蛇
    2020北大夏令营 终末游记
  • 原文地址:https://www.cnblogs.com/whoknows1/p/9413157.html
Copyright © 2011-2022 走看看