ztree传递自定义参数加载树的两种实现方式

场景：根据条件，查询树的数据

需求：点击左侧机构树，当点击节点的类型是用户时，如果用户已经分配了角色，添加角色的时候已经添加过的角色不显示。 

 

遇到的问题

想在请求角色列表的接口中增加一个自定义参数 

 var selectedUserId； 
 var setting = {
        check: {
            enable: true,
            chkStyle: "checkbox",
            chkDisabledInherit: true
        },
        view: {
            dblClickExpand: false
        },
        async: {
		    enable: true,
		    url: url =ctx_js + "/rolemgr/roles-group/searchRolesGroupByUserId? 
              nodeUserId="+selectedUserId,
		    autoParam: ["id","type"],
		    dataFilter: ajaxDataFilter
     	},
        data: {
            simpleData: {
                enable: true,
                idKey: "id",
                pIdKey: "pid",
                rootPId: '0'
            }
        },
        callback: {
            onClick:zTreeOnClick
        }
    };

	  $(document).ready(function(){
         selectedUserId="${fns:clearSpecialChars(nodeUserId)}";
	     $.fn.zTree.init($("#roleTree"), setting);
	     zTree = $.fn.zTree.getZTreeObj("roleTree");
	  });

参数在传递后台的时候始终传递不了。

 

Api上说必须是静态的参数键值对，如果动态传入参数呢？

解决方法一：通过函数调用路径变量。

//节点树的setting设置
	  var setting = {
        check: {
            enable: true,
            chkStyle: "checkbox",
            chkDisabledInherit: true
        },
        view: {
            dblClickExpand: false
        },
        async: {
		    enable: true,
		    url: getTreeUrl,
		    autoParam: ["id","type"],
		    dataFilter: ajaxDataFilter
     	},
        data: {
            simpleData: {
                enable: true,
                idKey: "id",
                pIdKey: "pid",
                rootPId: '0'
            }
        },
        callback: {
            onClick:zTreeOnClick
        }
    };

	  $(document).ready(function(){
	     $.fn.zTree.init($("#roleTree"), setting);
	     zTree = $.fn.zTree.getZTreeObj("roleTree");
	  });


    function getTreeUrl(){
       var selectedUserId="${fns:clearSpecialChars(nodeUserId)}";
       var url =ctx_js + "/rolemgr/roles-group/searchRolesGroupByUserId?nodeUserId="+selectedUserId;
       return url
     }
		

解决方法二：通过otherParam中添加函数调用。

 //节点树的setting设置
	  var setting = {
        check: {
            enable: true,
            chkStyle: "checkbox",
            chkDisabledInherit: true
        },
        view: {
            dblClickExpand: false
        },
        async: {
		    enable: true,
		    url: ctx_js + "/rolemgr/roles-group/searchRolesGroupByUserId",
		    autoParam: ["id","type"],
		    otherParam:{
		    	"nodeUserId":getOtherParam
			    },
		    dataFilter: ajaxDataFilter
     	},
        data: {
            simpleData: {
                enable: true,
                idKey: "id",
                pIdKey: "pid",
                rootPId: '0'
            }
        },
        callback: {
            onClick:zTreeOnClick
        }
    };

	  $(document).ready(function(){
	     $.fn.zTree.init($("#roleTree"), setting);
	     zTree = $.fn.zTree.getZTreeObj("roleTree");
	  });



    function getOtherParam(){
       var selectedUserId="${fns:clearSpecialChars(nodeUserId)}";
       return selectedUserId;
     }

测试结果