Extjs：为树加载动态数据答案

【问题标题】：Extjs: Loading Dynamic Data for TreeExtjs：为树加载动态数据
【发布时间】：2014-07-23 20:48:16
【问题描述】：

我是 Extjs 的新手，我想将数据动态加载到树中。服务器返回给我的不是 json 格式的数据，即数据的结构非常混乱。我应该在我的代码中指定什么 URL 以及如何处理数据格式。在查看服务器返回的数据时，无法区分父子节点。我正在尝试根据以下代码构建一棵树...

Ext.onReady(function() {

    var Tree = Ext.tree;

    var tree = new Tree.TreePanel({
        useArrows: true,
        autoScroll: true,
        animate: true,
        enableDD: true,
        containerScroll: true,
        border: false,
        // auto create TreeLoader
        dataUrl:'????????????????????',
        root: {
            nodeType: 'async',
            text: 'ALL',
            draggable: false,
            id: ''
        }
    });

    // render the tree
    tree.render('tree-div');
    tree.getRootNode().expand();
});

【问题讨论】：

标签： extjs tree

【解决方案1】：

当传递 dataUrl 配置选项时，您告诉树组件使用默认的 TreeLoader，它只接受 JS 数组 (JSON) 作为服务器的输出。如果您要从服务器传递其他数据，无论是 XML、YAML 还是您所说的其他 mumbojumbo，您都必须编写自己的 TreeLoader。

首先请查看Ext.tree.Treeloader 或source of TreeLoader 上的文档，这可能会让您在理解编写自己的接受服务器输出的加载程序时实际需要做些什么。

【讨论】：

感谢克里斯的提示。我从服务器获取数据作为 JS 数组。新的问题是如何让父节点有一个文件夹图标。我在哪里将“cls：文件夹”放在我的代码中。
与父节点是指根节点吗？这是在您上面发布的根配置选项中完成的。
这是我从数据库“代码”[{ id: 1 text: 'Test id X', children: [{ id: 2 text: 'Test id X.1' , 叶: true }] },{ id:3 text: 'Test id Y', children: [{ id:4 text: 'Test id Y.1', 叶: true },{ id:5 text: 'Test id Y.2', leaf: true },{ id:6 text: 'Test id Y.3', leaf: true }] 现在，我的 UI 如何显示 X 是根节点并且它应该显示一个文件夹图标， Y也一样

【解决方案2】：

通过将 json 对象直接添加到树中.....

Java 代码：

        for (Object object : objJSONArray) {
            i++;

            JSONObject jsobject = (JSONObject) object;
            if (i == 1) {

                treedata = jsobject;
                System.out.println("  rootnode is:::" + treedata);
            } else {
                String nodeparent = jsobject.getString("NODE_PARENT");
                String parentId = treedata.get("ID").toString();

                if (nodeparent.equals(parentId)) {
                    treedata.put("children", jsobject);
                    System.out.println("treedata  " + treedata);
                } else {
                    Set jsonKeys = treedata.keySet();
                    Iterator itr = jsonKeys.iterator();
                    while (itr.hasNext()) {
                        String keys = itr.next().toString();
                        Object keyObject = treedata.get(keys);
                        if (keyObject instanceof JSONObject) {
                            JSONObject jso = treedata.getJSONObject(keys);
                            String childParentID = jso.getString("ID");
                            if (childParentID.equals(nodeparent)) {
                                jso.put("children", jsobject);
                                treedata.put(keys, jso);
                            }
                        }
                    }
                }
            }
        }

【讨论】：