DOJO:动态创建/加载/获取树木

时间:2015-05-28 14:12:38

标签: html ajax

我想在dojo中动态加载树结构,每次加载(从服务器获取数据),只需点击下一层即可。这将有助于我不将整个树一起加载到内存中,但是当有人单击树的级别时,只有在dojo中使用ajax请求从服务器获取下一级别的所有元素。 有人可以帮我解决这个问题吗?

1 个答案:

答案 0 :(得分:0)

答案如下:使用dijit树,只需3个步骤即可创建一个懒惰加载的动态树:1。创建商店,2。创建模型,3。创建树。这是我使用的完美工作的代码片段:

function createLazyTreeStore()
{
    var store = new JsonRest({
        target: "location where your file is",

            getChildren: function(object) {
                // object may just be stub object, so get the full object first and then return it's
                // list of children
                return this.get(object.id).then(function(fullObject){
                    console.log(fullObject.children);
                    return fullObject.children;
                });
            }
        });
    return store;
}
function createModel(store)
{
    var model = new ObjectStoreModel({
        store: store,
        getRoot: function(onItem) {
            this.store.get("the .php file").then(function(item)
            {
                onItem(item[0]);
            });
        },

        getChildren: function(object, onComplete, onError)
        {
            this.store.get("your url to fetch the data with parent child relation").then(function(fullObject) {
            object.children = fullObject;
            onComplete(object.children);
            }, function(error)
            {
                console.error(error);
                onComplete([]);
            });
        },
        mayHaveChildren: function(object) {

            return true;
        }
    });
    return model;
}
function createTree(model)
{
    var tree = new Tree({
        model: model,
        style: "your preference",
        id: "tree",
    });
    return tree;
}

Then call these functions in the following order:
var store = createLazyTreeStore();
var model = createModel(store);
var tree = createTree(model);
accordionPane.addChild(tree);