Kendo UI TreeView - 如何为每个父节点填充不同的子节点?

时间:2013-07-26 17:33:57

标签: jquery treeview kendo-ui

以下填充父节点和子节点。问题是所有父节点的子节点都是相同的。我需要根据父节点的“id”填充子节点。我该怎么做呢?

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
    <head>
        <title>Kendo UI Test</title>
        <link href="styles/kendo.common.min.css" rel="stylesheet" type="text/css"/>
        <link href="styles/kendo.default.min.css" rel="stylesheet" type="text/css"/>
        <script src="js/jquery.min.js"> </script>
        <script src="js/kendo.web.min.js"> </script>
    </head>
    <body>
        <div id="treeview"></div>
        <script type="text/javascript">
            var notifications = {
                transport: {
                    read: {
                        url: "http://..."
                    }
                },
                schema: {
                    model: {
                        Notification: "Notification",
                        hasChildren: false
                    }
                }
            };

            var notificationTypes = new kendo.data.HierarchicalDataSource({
                transport: {
                    read: {
                        url: "http://..."
                    }
                },
                schema: {
                    model: {
                        NotificationType: "NotificationType",
                        hasChildren: true,
                        children: notifications
                    }
                }
            });

            $("#treeview").kendoTreeView({
                dataSource: notificationTypes,
                checkboxes: {
                    checkChildren: true
                },
                dataTextField: ["NotificationType", "Notification"]
            });
        </script>
    </body>
</html>

通过API调用收集子节点,如下所示:

/api/notifications/{id}

每位家长都有一个不同的ID,需要与孩子们匹配。

我真的迷失在这一点上,非常感谢我能得到的所有帮助。

由于

1 个答案:

答案 0 :(得分:0)

想出如何做到这一点:

function CreateNotificationTree(userId)
{
    debugger;
    var data = new kendo.data.HierarchicalDataSource({
        transport: {
            read: {
                url: "../api/notifications/byuserid/" + userId,
                contentType: "application/json"
            }
        },
        schema: {
            model: {
                children: "notifications"
            }
        }
    });

    $("#treeview").kendoTreeView({
        dataSource: data,
        loadOnDemand: true,
        dataUrlField: "LinksTo",
        checkboxes: {
            checkChildren: true
        },
        dataTextField: ["notificationType", "NotificationDesc"],
        select: treeviewSelect
    });

    function treeviewSelect(e)
    {
        var node = this.dataItem(e.node);
        window.open(node.NotificationLink, "_self");
    }
}