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. 河南省第五届ACM程序设计大赛

    D:   遥 控 器 #include<cstdio> #include<cstring> #include<iostream> #include<algor ...

  2. Delphi 版 MIB_IF_ROW2

    unit netioapi; interface uses Windows; type {$Z4} NDIS_MEDIUM = ( NdisMedium802_3, NdisMedium802_5, ...

  3. poj 1737 Connected Graph

    // poj 1737 Connected Graph // // 题目大意: // // 带标号的连通分量计数 // // 解题思路: // // 设f(n)为连通图的数量,g(n)为非连通图的数量 ...

  4. [Leetcode]Palindrome Number

    Determine whether an integer is a palindrome. Do this without extra space. 这题貌似解法挺多,直接用简单的把数倒置,没有考虑数 ...

  5. 工作随笔——Swift中的Range和一些字符操作

    截取字符串在Swift中相比OC要复杂很多,主要原因可能还是OC的NSRange的创建方法中参数类型为int,而Swift却对类型要求很严格,int不能作为参数创建Range,这要使用String中的 ...

  6. 【图像处理】第三次实验:JPEG图像压缩

    1.任务说明 将LENA图像用JPEG方式压缩. 2.算法原理 JPEG(Joint Photographic Experts Group)是一个由ISO和IEC两个组织机构联合组成的一个专家组,负责 ...

  7. 【C-01关键字】

    一.语句引导关键字 for   while   swith  if  do   goto   return 二.限定关键字 const  static   extern 三.预编译关键字 #inclu ...

  8. java中对List<Map<String,Object>>中的中文汉字排序

    import java.text.Collator;import java.util.ArrayList;import java.util.Collections;import java.util.C ...

  9. vpn找不到设备,win7建立新的VPN总时显示错误711,无法启动 Remote Access Connection Manager 及 Remote Access Auto Connection Manager 错误1068

    试试相关服务!一.remote access connection manager是网络连接的服务,它依赖于Technology服务,现在你的这个服务已经启动,而Secure Socket Tunne ...

  10. 微信网页开发之创建Controller(三)

    首先,我们需要在App区域下添加一个控制器,这里我们就以AppDemoController为例.如下图所示: 注意:你也可以自己创建其他区域,只是这里推荐使用App区域. 创建好之后,请添加自己的Ac ...