JSTree

var data = null;

function context_menu(node){
	 var tree = $('#cat_tree').jstree(true);
	    var items = {
	        "Create": {
	            "separator_before": false,
	            "separator_after": false,
	            "label": "新建",
	            "action": function (obj) { 
	                var $node = tree.create_node(node);
	                tree.edit($node);
	            }
	        },
	        "Rename": {
	            "separator_before": false,
	            "separator_after": false,
	            "label": "重命名",
	            "action": function (obj) { 
	                tree.edit(node);
	            }
	        },
	        "Edit": {
	            "separator_before": false,
	            "separator_after": false,
	            "label": "編輯",
	            "action": function (obj) { 
	                //tree.edit(node);
	            }
	        },                         
	        "Remove": {
	            "separator_before": true,
	            "separator_after": false,
	            "label": "刪除",
	            "action": function (obj) {
	                 if(confirm('Are you sure to remove this category?'))
	                	 tree.delete_node(node);
	                 $(event.target).parents('li').attr('id')
	                 console.debug('-----------------')
	                 console.debug(node)
	                 console.debug(obj)
	                 console.debug('-----------------')
	             }
	        }
	    };
	    return items;
	}

function createTree(){
	$('#MyTree').jstree({
	    'core' 	: {
			'data'  : data,
	     }
	,
	     'plugins': ['contextmenu'], 
	     'contextmenu' : {items: context_menu}
	}).on('click.jstree',function(event){
		var eventNodeName = event.target.nodeName; 
		if (eventNodeName == 'INS') {  
			console.debug(eventNodeName)
            return;
        }else if(eventNodeName == 'A'){
        	var $subject = $(event.target).parent();
        	if ($subject.find('ul').length > 0) {
        		console.debug('父節點');
            } else { 
              //選擇的id值
               console.debug('葉子節點');
               console.debug('節點ID:');
               var id = $(event.target).parents('li').attr('id');
               var node = $('#MyTree').jstree("get_node", id);
               console.debug(node.original.nodeUrl);                  
            }  
        }
	});
}


function queryTreeNode(){
	$.ajax({
		method : 'POST',
		url    : '/mysteel-black-mgt/queryTree',
		success: function(e){
			data = e.data;
			console.debug(data)
			createTree()
		}
	})
}
	queryTreeNode();

$(function () {
	
	//當樹加載完是默認選中第一個
	$('#MyTree').on('loaded.jstree', function(e, data){  
		parentId = e.target.firstElementChild.firstChild.id;//根節點id
	    console.debug(e)
	});
	
});

 

 

後端java代碼:

@Override
    public JSONObject loadAllTree(String id) throws Exception {
        List<ClassTree> list = classTreeMapper.findAllClassTree();
        Map<Long, List<ClassTree>> parentMap = new HashMap<Long, List<ClassTree>>();
        for (ClassTree classTree : list) {
            long pid = classTree.getPid();
            if (parentMap.containsKey(pid)) {
                parentMap.get(pid).add(classTree);
            } else {
                List<ClassTree> childList = new ArrayList<ClassTree>();
                childList.add(classTree);
                parentMap.put(pid, childList);
            }
        }
        JSONObject root = new JSONObject();
        JSONObject state = new JSONObject();
        state.put("opened",true);
        if("0".equals(id)){
        	state.put("selected",true);
        }
        root.put("id", "0");
        root.put("text", "收入分類");
        root.put("state", state);
        loadChildNode(root, parentMap,id);
        return root;
    }

    public void loadChildNode(JSONObject root, Map<Long, List<ClassTree>> parentMap,String id) {
        JSONArray childArray = new JSONArray();
        List<ClassTree> childList = parentMap.get(root.getLong("id"));
        if (childList != null && childList.size() > 0) {
            root.put("children", childArray);
            for (ClassTree obj : childList) {
            	JSONObject state = new JSONObject();
            	/*state.put("opened", true);*/
            	 if((obj.getId().toString()).equals(id)){
                 	state.put("selected",true);
                 }
                JSONObject childNode = new JSONObject();
                childNode.put("id", obj.getId().toString());
                childNode.put("text", obj.getName());
                childNode.put("nodeUrl", obj.nodeUrl());
                childNode.put("state", state);
                childArray.add(childNode);
                loadChildNode(childNode, parentMap,id);
            }
        }
    }