3

所以我想创建一个带有 kendo UI 树视图项的树，并将其绑定到作为 JSON 文件的远程分层数据源。

我希望生成的树类似于：

（汽车）

- （汽车）

----FM-1100

----FM-4200

--（自行车）

----FM-3100

（人员）

--（客户）

----GH-3000

--(贵宾)

----GH-3100

PS。() 中的名称应该类似于包含其“孩子”的文件夹

我已经在 kendo ui 网站上查看了有关上述所有内容的文档，但我对每次展开树中的项目时树视图用来加载更深阶段的整个回调函数有点困惑。

让我们以剑道文档中的示例为例：

var homogeneous = new kendo.data.HierarchicalDataSource({
transport: {
    read: {
        url: "http://demos.kendoui.com/service/Employees",
        dataType: "json"
    }
},
schema: {
    model: {
        id: "EmployeeId",
        hasChildren: "HasEmployees"
    }
}
});

$("#treeview").kendoTreeView({dataSource: homogeneous});

JSON 样本数据：

    {
"employees": [
{"EmployeeId":2,"FullName":"Andrew Fuller","HasEmployees":true,"ReportsTo":null},
{"EmployeeId":3,"FullName":"Carl Jenkins","HasEmployees":true,"ReportsTo":null},
{"EmployeeId":4,"FullName":"Aston Miller","HasEmployees":false,"ReportsTo":2},
{"EmployeeId":5,"FullName":"Damon Sherbands","HasEmployees":false,"ReportsTo":2},
{"EmployeeId":6,"FullName":"Dariel Hanks","HasEmployees":true,"ReportsTo":null},
{"EmployeeId":7,"FullName":"Jason Jackson","HasEmployees":false,"ReportsTo":3},
{"EmployeeId":8,"FullName":"Reylen Scribbs","HasEmployees":false,"ReportsTo":6}
]
}

因此，我必须在“http://demos.kendoui.c​​om/service/Employees”上设置一个休息服务器，该服务器接受来自提供“EmployeeId”的树的 GET，然后在文件中进行搜索并返回那些“ReportTo”收到“EmployeeId”...?? 树想要显示初始节点时会发生什么？

就像是：

@Path("/Employees")
@GET
@Produces(MediaType.TEXT_HTML)
public String returnEmployees(@QueryParam("EmployeeId") int accID) {
    //search the employees.json
    return "<head></head><body><pre>" + searchResultsString + "</pre></body>";
}

如何有效地搜索 JSON 文件并以字符串形式返回所有结果？或者，如果所有这些都是错误的，有人可以帮助我理解所有 GET 和回调的东西吗？也许它确实与我听说过的 jsonp 有关？这里有点迷失......

提前致谢

4

3 回答 3

3

您是否能够创建具有以下结构的 JSON 文件（类似于您建议的 XML 格式）？

[
    {
        "id"   :100,
        "text" :"tree",
        "items":[
            {
                "id"   :1,
                "text" :"Vehicle",
                "items":[
                    {
                        "id"   :2,
                        "text" :"Cars",
                        "items":[
                            {
                                "id"  :3,
                                "text":"FM-1100"
                            },
                            {
                                "id"  :4,
                                "text":"FM-4200"
                            }
                        ]
                    },
                    {
                        "id"   :5,
                        "text" :"Bikes",
                        "items":[
                            {
                                "id"  :6,
                                "text":"FM-3100"
                            }
                        ]
                    }
                ]
            },
            {
                "id"   :7,
                "text" :"Personnel",
                "items":[
                    {
                        "id"   :8,
                        "text" :"Personnel",
                        "items":[
                            {
                                "id"   :9,
                                "text" :"Clients",
                                "items":[
                                    {
                                        "id"  :10,
                                        "text":"GH-3000"
                                    }
                                ]
                            },
                            {
                                "id"   :11,
                                "text" :"VIPs",
                                "items":[
                                    {
                                        "id"  :12,
                                        "text":"GH-3100"
                                    }
                                ]
                            }
                        ]
                    }
                ]
            }
        ]
    }
]

其中每个元素都有一个id将text显示在树中的 a 和一个items包含树的每个子元素的数组。

如果是这样，您的代码应该是：

$.getJSON("/testTree.json", function (data) {
    $("#treeview").kendoTreeView({
        dataSource: data
    });
})

/testTree.jsonJSON 文件的 URL在哪里。

于 2012-11-08T13:21:20.757 回答
1
于 2014-08-11T12:06:07.083 回答
0

嗨：您应该在架构中添加数据属性：

schema: {
    model: {
        id: "EmployeeId",
        hasChildren: "HasEmployees",
        data: "employees"
    }
}
于 2017-01-28T11:20:26.870 回答