如何使用递归对象extjs填充商店?

时间:2013-12-09 11:58:23

标签: javascript extjs recursion tree

我有一个具有这种结构的对象

第一 持续 UID ID rels []

Rels是一个数组,它再次包含具有相同结构的对象。 我如何管理这个对象,以便在加载中使用extjs填充treeStore?我需要维护父和子之间的层次结构

例子


child1
的child2
 nephew1
 nephew2

等等。它们都在父节点下。

有什么建议吗?我试过几种方式使用递归函数,但没有结果。

这是我的代码(不工作)

Ext.define('utenti', {

    extend: 'Ext.data.Model',
    fields: [{
            name: 'F',
            type: 'string'
        },
        {
            name: 'L',
            type: 'string'
        },
        {
            name: 'Uid',
            type: 'string'
        },
        {
            name: 'Id',
            type: 'string'
        }
    ]
});

var TreeUserStore = Ext.create('Ext.data.TreeStore', {
    model: 'utenti',
    root: {
        text: 'Root',
        //id: 'Radice_utenti',
        expanded: true
    },
    listeners: {

        load: function eachRecursive(ResObj) {
            var childNode;
            if (ResObj.Rels.length > 0) {
                for (i = 0; i < data.Rels.length; i++) {
                    eachRecursive(ResObj.Rels[i]);

                }
            } else {
                childNode = Ext.create('utenti', {
                    F: ResObj.F,
                    L: ResObj.L,
                    Uid: ResObj.Uid,
                    Id: ResObj.Id
                });
                TreeUserStore.appendChild(child);
            }
        }
    }


});

我找到了从对象中提取数据的函数

function eachRecursive(ResObj, parent) {

    if (ResObj.Rels.length > 0) {

        var childNodeModel = {
            name: ResObj.F + " " + ResObj.L,
            text: ResObj.F + " " + ResObj.L,
            leaf: false,
            children: []
        };

        alert("padre:" + parent.name + ", figlio:" + childNodeModel.name);
        parent.children.push(childNodeModel);

        for (var i = 0; i < ResObj.Rels.length; i++) {
            eachRecursive(ResObj.Rels[i], childNodeModel);
        }
    } else {
        var childNodeModel = {
            name: ResObj.F + " " + ResObj.L,
            text: ResObj.F + " " + ResObj.L,
            leaf: true
        };
        alert("padre:" + parent.name + ", figlio:" + childNodeModel.name);
        parent.children.push(childNodeModel);

    }

}

但目前我无法在TreePanel元素中展示。我尝试使用appendChild但没有任何结果,我也试图创建TreeNode但它给了我error,例如object is not a function

我该怎么办?

提前致谢

2 个答案:

答案 0 :(得分:2)

您应该使用appendChild节点的方法将子节点添加到层次结构中。

你的递归函数应如下所示:

function eachRecursive(ResObj, parent) {

    if (ResObj.Rels.length > 0) {

        var childNodeModel = {
            name: ResObj.F + " " + ResObj.L,
            text: ResObj.F + " " + ResObj.L,
            leaf: false,
            children: []
        };

        var childNode = parent.appendChild(childNodeModel);

        for (var i = 0; i < ResObj.Rels.length; i++) {
            eachRecursive(ResObj.Rels[i], childNode);
        }
    } else {
        var childNodeModel = {
            name: ResObj.F + " " + ResObj.L,
            text: ResObj.F + " " + ResObj.L,
            leaf: true
        };
        parent.appendChild(childNodeModel);

    }
}

然后你开始从root填充商店:

eachRecursive(data, TreeUserStore.getRootNode());

答案 1 :(得分:1)

Ext.override(Ext.data.TreeStore, {
            appendChildRecusive: function (nodeTarget, itemsJson) {
                for (i in itemsJson) {
                    var newNode = nodeTarget.createNode(itemsJson[i]);

                    if (i != 'hasObject')
                        nodeTarget.appendChild(newNode);

                    if (itemsJson[i].children != undefined)
                        this.appendChildRecusive(newNode, itemsJson[i].children);
                }
            }
        });