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>

KendoUI系列:TreeView的更多相关文章

  1. [WPF系列]-TreeView的常用事项

    引言 项目经常会用Treeview来组织一些具有层级结构的数据,本节就将项目使用Treeview常见的问题作一个总结. DataBinding数据绑定 DataTemplate自定义 <Hier ...

  2. Silverlight自定义控件系列 – TreeView (1)

      原文路径:http://blog.csdn.net/wlanye/article/details/7265457 很多人都对MS自带的控件不太满意(虽然MS走的是简约风格),都会试图去修改或创建让 ...

  3. KendoUI系列:Window

    1.基本使用 <link href="@Url.Content("~/Content/kendo/2014.1.318/kendo.common.min.css") ...

  4. KendoUI系列:MultiSelect

    1.基本使用 1>.创建Input <link href="@Url.Content("~/Content/kendo/2014.1.318/kendo.common. ...

  5. KendoUI系列:DatePicker

    1.基本使用 <link href="@Url.Content("~/C ontent/kendo/2014.1.318/kendo.common.min.css" ...

  6. KendoUI系列:DropDownList

    1.基本使用 1>.创建Input <input id="dropDownList" /> <link href="@Url.Content(&q ...

  7. [转]KendoUI系列:Grid

    本文转自:http://www.cnblogs.com/libingql/p/3774879.html 1.基本使用 <div id="grid"></div&g ...

  8. asp.net 第三方UI控件 Telerik KendoUI 之 TreeVIew 的用法记录

    一.前台显示 备注:一次性取出所有节点 function loadTreeData() { $.ajax({ type: 'POST', url: '@(Html.UrlHref("Scri ...

  9. Silverlight自定义控件系列 – TreeView (2) 基本布局和States

    TreeView的树形结构都以缩进方式显示,现在来完成这部分. 首先,要定义出每个节点上都包含什么东西.先看看Win7资源管理器的TreeView: 图2.1 资源管理器 一个通用的TreeView至 ...

随机推荐

  1. IntelliJ IDEA 发布最新版本13.0.1

    难闻转自:慧都控件网 值得高兴的消息,IntelliJ IDEA v13.0.1目前已经发布,相对于IntelliJ IDEA v13而言,此次更新内容,是略微改进和提高了性能,如代码输入变化,及完善 ...

  2. C# 图片压缩

    /// <summary>        /// 图片压缩方法        /// </summary>        /// <param name="sF ...

  3. mono for android 各版本下载地址

    window下 在XamarinStudio 检查更新,会在这个目录下生成LOG和下载文件,所以可以从里面复制出来,查看真实下载地址 C:\Users\用户名\AppData\Local\Xamari ...

  4. JavaScript 基础第九天(DOM第三天)

    一.引言 我们昨天介绍了很多的概念以及大部分我们可以在工作中用到的事件,那么今天我们将运用这些知识做一些效果! 二.导入 今天的内容以实例为主. 三.重点内容 祝愿墙的简单构建: 首先我将介绍出本次实 ...

  5. 关于winform中*.exe.config中的appSettings的节点的读取与修改

    //读取到这个节点 string file = System.Windows.Forms.Application.ExecutablePath; Configuration config = Conf ...

  6. poj 3067 - Japan(树状数组)

    先按第一个数从大到小排序,相等的情况下,第二个数按照从大到小排序..... 预处理后,照着树状数组写就行了... 注意:k的最大值应取1000*1000 代码如下: include <cstdi ...

  7. .Net Core CLI在CentOS7的安装及使用简介

    1. 安装libunwind cd /usr/local/src wget http://download.savannah.gnu.org/releases/libunwind/libunwind- ...

  8. 自己写一个java.lang.reflect.Proxy代理的实现

    前言 Java设计模式9:代理模式一文中,讲到了动态代理,动态代理里面用到了一个类就是java.lang.reflect.Proxy,这个类是根据代理内容为传入的接口生成代理用的.本文就自己写一个Pr ...

  9. 设计模式之美:Behavioral Patterns(行为型模式)

    行为型模式涉及到算法和对象间职责的分配. 行为模式不仅描述对象或类的模式,还描述它们之间的通信模式. 这些模式刻划了在运行时难以跟踪的复杂的控制流.它们将你的注意力从控制流转移到对象间的联系方式上来. ...

  10. Python3实现TCP端口扫描器

    本文来自 高海峰对 玄魂工作室 的投稿 作者:高海峰 QQ:543589796 在渗透测试的初步阶段通常我们都需要对攻击目标进行信息搜集,而端口扫描就是信息搜集中至关重要的一个步骤.通过端口扫描我们可 ...