전,

Question

가 나는 Ext.tree.TreePanel 객체가 있다고 가정하자의 ExtJS TreePanel에서 JSON 데이터 가져 오기, 그것은 데이터를 외부 파일에서로드 나무.

사용자가 트리에 새 노드를 추가하고 일부 노드를 이동시킵니다. 트리에서 JSON 데이터를 가져와 다음에 사용자가 트리를로드 할 때 사용할 수 있습니까?

EDIT (코드 솔루션) : 여기

후안의 반응에서 아이디어를 기반으로하는 솔루션이다. 미래에이 스레드를 발견하고 일부 코드를 찾고있는 경우에 대비하여이 코드를 사용하고 있습니다.

function getNodeList(bfsQueue) { 
    var node = bfsQueue.pop(); 
    var nodeQueue = []; 

    for (var ii = 0; ii < node.childNodes.length; ii++) { 
     bfsQueue.push(node.childNodes[ii]); 
     nodeQueue.push(node.childNodes[ii]); 
    } 
    if (bfsQueue.length === 0) { 
     return nodeQueue; 
    } else { 
     return nodeQueue.concat(getNodeList(bfsQueue)); 
    } 
} 

var startQueue = []; 
var nodeList = []; 

startQueue.push(tree.getRootNode()); 
nodeList.push(tree.getRootNode()); 
nodeList = nodeList.concat(getNodeList(startQueue)); 
console.dir(nodeList); 

for (var nn = nodeList.length-1; nn >= 0; nn--) { 

    var params = []; 
    for (var pp in nodeList[nn].attributes) { 
     if (pp === "children" || pp === "loader") {continue;} 
     params.push('"' + pp + '":' + JSON.stringify(nodeList[nn].attributes[pp]) + ''); 
    } 

    if (nodeList[nn].childNodes.length > 0) { 
     var childList = []; 

     for (var ii = 0; ii < nodeList[nn].childNodes.length; ii++) { 
      childList.push(nodeList[nn].childNodes[ii].json); 
     } 

     params.push('"children": [' + childList.join(',') + ']'); 
    } 

    nodeList[nn].json = "{" + params.join(",") + "}"; 
} 

console.log(nodeList[0].json); // root node 

Answer 1

우선 무엇이 정말로 필요한 건 노드를 만드는 데 사용되는 JSON 속성 속성입니다. 대부분의 관련 속성은 업데이트되지만 childNodes는 업데이트되지 않습니다. 따라서 다시 넣기 위해 뭔가를 써야합니다.

모든 노드를 가져 와서 childNodes를 사용하여 트리를 탐색 할 수 있습니다. 다시 json으로 재구성해야합니다.

Ext.data.Node.prototype.getJson = function() { 
     // Should deep copy so we don't affect the tree 
     var json = this.attributes; 

     json.children = []; 
     for (var i=0; i < node.childNodes.length; i++) { 
      json.children.push(node.childNodes[i].getJson()) 
     } 
     return json; 
} 

tree.getRootNode().getJson(); 

이 예는 완벽하지는 않지만 시작하기에 충분합니다.

업데이트 내선-JS 4.0 노드에서

이제 Records로 장식되어 있습니다. 따라서, 모든 여분의 특성은 기록/모델 인터페이스를 통해 문서화되어야하고 get 및 set 방법 트리 노드에 대한 NodeInterface이를 않는 직렬화 기능이있는 최신의 ExtJS 버전에서

Answer 2

를 사용하여 설정 클라이언트로 가져온. 어쩌면 그것이 당신과 관련이 있을지도 모릅니다.