zoukankan      html  css  js  c++  java
  • KendoUI系列:TreeView

      1、加载本地数据

    <link href="@Url.Content("~/Content/kendo/2014.1.318/kendo.common.min.css")" rel="stylesheet" type="text/css" />
    <link href="@Url.Content("~/Content/kendo/2014.1.318/kendo.default.min.css")" rel="stylesheet" type="text/css" />
    <script src="@Url.Content("~/Scripts/kendo/2014.1.318/jquery.min.js")" type="text/javascript"></script>
    <script src="@Url.Content("~/Scripts/kendo/2014.1.318/kendo.web.min.js")" type="text/javascript"></script>
    <div id="treeView"></div>
    <script type="text/javascript">
        $(function () {
            var dataSource = new kendo.data.HierarchicalDataSource({
                data: [{
                    id: "110000",
                    text: "北京市"
                }, {
                    id: "310000",
                    text: "上海市"
                }, {
                    id: "350000",
                    text: "福建省",
                    expanded: true,
                    items: [{
                        id: "350100",
                        text: "福州市"
                    }, {
                        id: "350200",
                        text: "厦门市"
                    }, {
                        id: "350500",
                        text: "泉州市"
                    }]
                }, {
                    id: "440000",
                    text: "广东省",
                    expanded: true,
                    items: [{
                        id: "440100",
                        text: "广州市"
                    }, {
                        id: "440300",
                        text: "深圳市"
                    }]
                }]
            });
    
            $("#treeView").kendoTreeView({
                checkboxes: {
                    checkChildren: true
                },
                dataSource: dataSource
            });
        });
    </script>

      效果预览:

    <script type="text/javascript">
        $(function () {
            var dataSource = new kendo.data.HierarchicalDataSource({
                data: [{
                    ProvinceID: "110000",
                    ProvinceName: "北京市"
                }, {
                    ProvinceID: "310000",
                    ProvinceName: "上海市"
                }, {
                    ProvinceID: "350000",
                    ProvinceName: "福建省",
                    expanded: true,
                    Cities: [{
                        CityID: "350100",
                        CityName: "福州市"
                    }, {
                        CityID: "350200",
                        CityName: "厦门市"
                    }, {
                        CityID: "350500",
                        CityName: "泉州市"
                    }]
                }, {
                    ProvinceID: "440000",
                    ProvinceName: "广东省",
                    expanded: true,
                    Cities: [{
                        CityID: "440100",
                        CityName: "广州市"
                    }, {
                        CityID: "440300",
                        CityName: "深圳市"
                    }]
                }],
                schema: {
                    model: {
                        children: "Cities"
                    }
                }
            });
    
            $("#treeView").kendoTreeView({
                checkboxes: {
                    checkChildren: true
                },
                dataSource: dataSource,
                dataValueField: ["ProvinceID", "CityID"],
                dataTextField: ["ProvinceName", "CityName"]
            });
        });
    </script>
  • 相关阅读:
    Android入门:Button
    Android入门:部署时的常见错误
    to be
    Android入门:单元测试
    忘记 MySQL 的 root 帐号密码该怎么办
    Eclipse开发build path中jar包部署到应用中
    报告两个bug
    本站导引
    一个用Word做报表设计的报表系统windwardreports
    智能互联网
  • 原文地址:https://www.cnblogs.com/libingql/p/3784195.html
Copyright © 2011-2022 走看看