从ExtJS树面板获取JSON数据

rlcwz9us 于 2022-11-04 发布在其他

关注(0)|答案(4)|浏览(148)

假设我有一个Ext.tree.TreePanel对象，它包含从外部文件加载的数据，例如：

var tree = new Ext.tree.TreePanel({
    ...
    loader: new Ext.tree.TreeLoader({
        dataUrl:'./some_file.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

extjs

来源：https://stackoverflow.com/questions/4391518/get-json-data-from-extjs-treepanel

4条答案

按热度按时间

czfnxgou1#

首先，你真正需要的是attributes属性，也就是创建节点所用的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();

这个例子并不完美，但是应该足够给予你开始使用了。

更新

在Ext-JS 4.0中，节点现在被修饰为记录。因此，所有额外的属性都应该通过记录/模型接口进行记录，并使用get和set方法进行检索

赞(0）回复(0）举报 2022-11-04

py49o6xq2#

在最新的ExtJS版本中，树节点的NodeInterface有一个序列化函数来实现这个功能，也许这与你有关。

赞(0）回复(0）举报 2022-11-04

yzuktlbb3#

getTreeObjectJSONData: function (objectPanel) {
    var objectStore = objectPanel.getStore(),
        dataCollection = [];
    if (objectStore.data.items !== undefined) {
        $.each(objectStore.data.items, function (index, objectData) {
            if (!objectData.data.leaf) {
                dataCollection['groups'].push({
                    display_name: objectData.data.name,
                    group: objectData.data.group,
                    crudState: objectData.data.crudState,
                    unique_id: objectData.data.unique_id
                });
            } else {
                dataCollection['fields'].push({
                    display_name: objectData.data.name,
                    group: objectData.data.group,
                    type: objectData.data.type != undefined ? objectData.data.type : 'null',
                    crudState: objectData.data.crudState,
                    unique_id: objectData.data.unique_id
                });
            }
        })

    }
    return Ext.util.JSON.encode(dataCollection);
}

可能吧，会有帮助的

赞(0）回复(0）举报 2022-11-04

yacmzcpb4#

var root = TreePanel.getRootNode();
var res = root.serialize();
console.log(res)

赞(0）回复(0）举报 2022-11-04

我来回答

从ExtJS树面板获取JSON数据

4条答案

相关问题

热门标签

最新问答