1.需求:选中树的某个节点后显示完整路径(即重根节点到选中节点),并在回显中也回显完整路径。 2.代码: html:
<select id="HFIRE_AREA_ID" name="HFIRE_AREA_ID" class="easyui-combotree" editable="true"></select>js:
//下拉树 $('#HFIRE_AREA_ID').combotree({ url:'${ctx}/PoliceController/getAreaTree', animate:true, lines:true, onlyLeafCheck:true, //设置父级无复选框 checkbox:true, multiple: false, cascadeCheck:true, required: true, onClick : function(node){ var t = $('#HFIRE_AREA_ID').combotree('tree');// 得到树对象 var pathName=getTreePathNames(t, node); areaValues=getTreePathValues(t, node); $('#HFIRE_AREA_ID').combotree("setText",pathName); //alert(areaValues) }, onChange:function(newValue, oldValue){ var t = $('#HFIRE_AREA_ID').combotree('tree');// 得到树对象 //获取当前选中的节点 var node = t.tree('getSelected'); var pathName=getTreePathNames(t, node); areaValues=getTreePathValues(t, node); fx=pathName; $('#HFIRE_AREA_ID').combotree("setText",pathName); }, onLoadSuccess:function(node, data){//解决编辑时反选的问题 $('#HFIRE_AREA_ID').combotree("setText",fx); } }); /** * 根据叶子节点选中的值,获取该叶子节点树整个路径的名称 * @param treeObj 树对象,(combotree的树对象获取:var treeObj = $('#树id').combotree("tree");) * @param node 叶子节点 */ function getTreePathNames(treeObj, node){ var pathName = node.text; var parentNode = treeObj.tree("getParent", node.target); if(parentNode != null && parentNode != "undefined"){ pathName = getTreePathNames(treeObj, parentNode) + " > " + pathName; } return pathName; }; /** * 根据叶子节点选中的值,获取该叶子节点树整个路径的值 * @param treeObj 树对象,(combotree的树对象获取:var treeObj = $('#树id').combotree("tree");) * @param node 叶子节点 */ function getTreePathValues(treeObj, node){ var Values = '"'+node.id+'"'; var parentNode = treeObj.tree("getParent", node.target); if(parentNode != null && parentNode != "undefined"){ Values = getTreePathValues(treeObj, parentNode) + ',' + Values; } return Values; };