JQuery easyUI Tree 一次性生成無限層結構樹

實體類

public class NodeBo
{
    private String id;
    private String parentid;
    private String parent;
    private String text;
    private String state; //（closed節點關閉，open節點打開）
    private int checked;//（1爲已選擇，0爲未選擇）
    private List<NodeBo> children = new ArrayList<NodeBo>();
    get,set方法

}   

Service層：

public synchronized List<NodeBo> queryFolDepts()
    {
        List<NodeBo> allNodes = new ArrayList<NodeBo>();
        long startTime = System.currentTimeMillis();
        List<NodeBo> nodes = ntpamFolDeptSettingDAO.queryFolDepts(null);
        for(int index=0;index<nodes.size();index++)
        {
            NodeBo nodeBo = nodes.get(index);
            allNodes.add(iteratorNodes(nodeBo));
        }
        long endTime = System.currentTimeMillis();
        System.out.println((endTime-startTime)/1000+"秒");
        return allNodes;
    }
    
    private NodeBo iteratorNodes(NodeBo nodeBo)
    {
        List<NodeBo> nodes = ntpamFolDeptSettingDAO.queryFolDepts(nodeBo.getId());
        if(nodes.size()>0)
        {
            nodeBo.setChildren(nodes);
            for(int index=0;index<nodes.size();index++)
            {
                NodeBo node = nodes.get(index);
                iteratorNodes(node);
            }
        }
        else
        {
            nodeBo.setState("open");    
        }
        return nodeBo;
    }

   DAO層：

public List<NodeBo> queryFolDepts(String parentCode)
    {
        StringBuilder sql = new StringBuilder();
        sql.append(" SELECT");
        sql.append("     dept_code id,");
        sql.append("     dept_name_zhs text,"); 
        sql.append("     parent_dept_code parentid,");
        sql.append("     DECODE(IS_CHECKED,'T','1','0') checked,");
        sql.append("     'closed' state");
        sql.append(" FROM");
        sql.append("     tcm_fol_dept");
        sql.append(" WHERE");
        sql.append("     enabled_flag = 'Y'");
        Object[] obj = new Object[1];
        if(StringUtils.isEmpty(parentCode))
        {
            sql.append(" AND parent_dept_code IS NULL ");
            obj = null;
        }
        else
        {
            sql.append(" AND parent_dept_code = ?");
            obj[0] = parentCode;
        }
        sql.append(" order by dept_code ");
        return this.queryForBeanList(sql.toString(), obj, NodeBo.class);
    }

頁面HTML，JS

function initPromotionTree() {
    var postUrl="ntpamFolDeptSettingJsonService/queryFolDepts.jssm?CommandName=queryFolDepts";
    
    $("#menuTree").tree(
    {
        method: "post",
        url: postUrl,
        checkbox: true,
        lines: true,
        cascadeCheck: true,
        onLoadSuccess: function(node, data)
        {
            
        },
        onExpand: function(node)
        {
            if(node.checked){
                $('#menuTree').tree('check', node.target);
            }
        }
    });
}

<div class="easyui-panel" style="width:1000px;height:500px;padding:10px;">
        <div class="easyui-layout" data-options="fit:true">
            <div title="菜單" data-options="region:'center'" style="width:300px;padding:10px">
                <ul id="menuTree" class="easyui-tree"></ul>
            </div> 
        </div>
    </div>

效果展示

我這一共有一萬多條數據，從請求到頁面加載大概50秒,當然也可以分步加載，這看個人業務了