参考连接:http://demos.telerik.com/aspnet-mvc/razor/treeview/clientsideapi

问题:

Telerik TreeView 选择或取消 父选项时候,子选项不会跟着变化。

现在通过OnChecked来实现,点击的时候找到子选项,再选中或取消。。

现象:
aaarticlea/png;base64,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" alt="" />

实现效果:

aaarticlea/png;base64,iVBORw0KGgoAAAANSUhEUgAAAMcAAACWCAIAAADltQvDAAAJLklEQVR4nO2dS48UVRiG+4fwM+onaBBxb0IQmJTGxIWJMRF3Ji7caIkhCLJgYZRMosloYiqKl6ARDdcMJM5Em4GBCQ4MMEShu+nGRbmo23cuVV1d9VXz9en3ySx66tpMPZxzuup7+3QiALjpPO03ABwEVgF+YBXgB1YBfmAV4AdWAX5gFeAHVgF+YBXgB1YBfmAV4AdWAX5gFeAHVgF+YBXgB1YBftqy6sNDh6r8tHR28HRp0aqejeFwOBqNBoNBr9eDVa7SrlVL35yiP+cuXj6x+PPB975cW7/V7/dhlau0btWF5ZX45+Ll1e0H/7742oln9hw+dfryYDCAVa4yJasuXVm9sbH51XfLz+45/MrBk7dv3xnXA4Z+xwu62q/dwOt0Oh1lTUK6yr4WTJWmVi3debKwOjKXZ1at/HVtfePvlT/XHj7q7Xvj0517j/z46+rVtbVaVpnLoyhKjPLD/NcgjGRj+1c4RCOrFm+Ndpx5vOPMY3NVbNVv5y6dW7722dLZ7QcPvv9lZde+oy+/dXI4HK6srPJZ1Q08otRsAKsKOHlrtOPM43fX/yux6vqNm6+/88XOvUeW/9h49e3F3QeOfXt6ZTAYrF27zmZViVSkV0y3CP2OF4TJcj/MN0kPqmyQn6noUIGv97r5lvGG5mah36HH0ndwgJpWLaZKlVt1afnK9Ztbz7308a79R3cfOLbw5ufD0ZNer3dzY4PTKvt/+9DPrlM38PLdO+ZLsi1Zqu5lP1S+E3Eo9TN3qHQzd2xKqWPV0p0nmVLlVv1+9vzd+/+8f/yH5/cfe2Hhk69PXYlvVm1ubrbeVqnL02tHd7e+Vo6f7FX9UKRJSxufcWfpBp5zHzDqWLWwmgyn4p+S0fr5Cxe73avrG1sfHP/+oxM/PXw0uL+9fe/e/a2tu+OsUpug/LpWHlcxWJUeYjKrtPcy3t0otdGZNmsa99b7/f5oNBoOh/1+n95nL79fFfrKYCf9k9vGuaSTiaLsM6DWbZlSFl3vdKmyV8VD0Xddfhb9X1HYk88gkp8Dmregiu9X0a5HaWu0RZXaKt/39OFz9UPRd1LYA6Yjdj8kY3dnmirULOg4/pl/OsAqDVjFAKzSgFUMwCrAD6wC/MAqwA+sAvzAKsAPrAL8SLEKmRyXEGQVMjnOIMsqZHLcQJxVyOQ4gFCrJs/kJJCaFbpIK/k1yxvUrZUjKFUutBxB+d04nFrjqT4IKqz/tD4vUs4zE4+TxFlVN5MTRVFco+T79nI/WndFCmv0qxT6Hc/zrEIUPSIsWE7VUQs+i0upiqyaCZdyZFnVIJMTRenVUq6Z5YoUlViRJaH1EBNaRd5HN/D8IPDywr8iS2AVK40zOVF+tXStqhRn6mvVuEItq/L3Eb/I2i7SiFkDOXrCpzACqRb7ZfWGcedcHiVqN9gjy6oGmRwqk9YYJH9BJXFV2gOqDlnHVfRaFLYleYV7krZJQzdmtTQN5NgSPuqJCzM/tCS7LErUcrBHllUNMjmKSpZQQp5vLpIjxsxU1W6r0iOkl1DvoMcEcqyxC8s/r3LQg7xuOdgjy6oGmRzzA5luTHotyocpZsamgVXdwPOCkA6o/EAZbZUFcrLVLViVHWYeesD6mRxbFMoPoygM6EVKe5mSEbG6NmlO6lqV7E8vKr2O1jGfNeFjDv5qxIfsf6Y2WixBVjV5Dmj+4UnLpDVek1il9BVF943KGj9t6KbfTrMFcoyET/lofSKT0tctB3ukWAVcAlYBfmAV4AdWAX5gFeAHVgF+YBXgB1YBfmAV4EeKVcjYuIQgq5CxcQZZViFj4wbirELGxgGEWlUnY6M9h1eKJOuVe9Aat4olWSCKBFpVM2NjydJkNLaqzmZzrZosq+pnbMouIqyaNrKsajbvTVGWJn5hlOXmoQNav2YkVbQ+NP9y7kBZqwRjzFLB+UKWVY0yNoVZGlIASdbptd4k5VKc2cprOfUaUX092ioBNM/YJChZGtOJ9JLrDZU15WIcwR5gLd1lLpFlVYOMTY6RpVECgEZ2apJpZ2BVNWRZ1SBjU5KlUUdFnu975SmXEkWKekBYpSDIqmbPAUuyNHrIbmzKpUyR9Dz6aN0ItIQ+fTPzhRSrZo9ZnJh3WsCqmph9J8iAVROh95fACqwC/MAqwA+sAvzAKsAPrAL8wCrAjxSrkLFxCUFWIWPjDLKsQsbGDcRZhYyNAwi1yoF5bGyHiiJSQqPXyoT0O9DJo6EZfNoozip35rFJDmX5+uG8ul09DflaYkWwYNaeOMqyyql5bNJghdEg+SRmSOsH83LAWX9wLcsqt+axiZeH6tRb8ZK8bD4vMXRHKmFWuTWPTS6oOtmWXkcfReY2s40sq9yax0bPUFjiYsmqbuk0JLOHLKvcmseG9nR0rKadQhvGuaCVLKvcmsdGz1AYA7X8DPqIHp8BWXBxHhutTaIf9zRxjd1pJfMMDrOkWAVcAlYBfmAV4AdWAX5gFeAHVgF+YBXgB1YBfmAV4EeKVcjYuIQgq5CxcQZZViFj4wbirELGxgGEWjVpxsYIFqglBX5YYS6asuQNmAhxVtXM2GjV4R2tLm6sJXP9lcPsyLKqfsZGrdH1g6ycqWIdOKziRJZVDTI2mT1ZjiXLlGpTgIR+/LXWSmdns4qUztEkhTLLTTp9TdLHKsfUp8iZH2RZ1SRjk2cNkjpiLcmpRmXyGLMZaM5DEyT2me9rqRqmBcTZfupYb66QZVWjeWziq5heSyNxaq0hLk46GFN06fGYsa/V4d1cIcuqRvPYpHGVvIHxAzKomrpV2WHQAz4tmmZsosiIq8SdmplBqGaV3gOa87NVsipyJDc6GYKsav4cULsnFSrfDzOpVXS0PZFJ6etQ+y6aOUKKVcAlYBXgB1YBfmAV4AdWAX5gFeAHVgF+YBXgB1YBfqRYhYyNSwiyChkbZ5BlFTI2biDOKmRsHECoVfwZG6XaU6uWQbSGGXFWtZaxsX55P0IQrSDLqjYzNpXLqkBjZFk1lYxNBKvaRpZVU8nYaD1g2fQjoB6yrGo5Y2P6g7aqFWRZNZWMDQVWtYIsq6aSsaHAqlYQZNW0MjYUWNUKUqwCLgGrAD+wCvADqwA/sArwA6sAP7AK8AOrAD+wCvDTllXIzMwz/wMLmqiF0ZXoLAAAAABJRU5ErkJggg==" alt="" />

代码:

@using TEST.XWebFramework.Extensions
@using Telerik.Web.Mvc;
@using Telerik.Web.Mvc.UI;
@using TEST.Business.Public;
@using TEST.Admin.Models.Support;
@{
Layout = "~/Views/Shared/_ListLayout.cshtml";
}
@model IEnumerable<TreeData>
@section HeadContent{
<style type="text/css">
.t-panelbar .t-group
{
border-bottom-width: 0px;
}
</style>
}
<div>
@(Html.Telerik().TreeView()
.Name("TreeView")
.ShowCheckBox(true)
.ClientEvents(events =>
events.OnSelect("onSelect")
.OnChecked("onChecked") //选择节点事件
)
.BindTo(Model, mappings =>
{
mappings.For<TreeData>(binding => binding
.ItemDataBound((item, node) =>
{
item.Text = node.text;
item.Value = node.id;
item.Checked = node.Checked;
})
.Children(p => p.children));
})
.ExpandAll(true)
)
</div>
@section FootContent{
<script type="text/javascript">
var Tree = {};
function getSelected() { //返回li对象
return $('#TreeView .t-state-selected').closest('li');
} //返回item的名称
function getSelectedName() {
var li = $('#TreeView .t-state-selected').closest('li'); if (li.length != ) {
return
li.find("span").Text;
} else { return ""; }
} //返回item的id
function getSelectedValue() {
var li = $('#TreeView .t-state-selected').closest('li'); if (li.length != ) {
return li.find("input[name='itemValue']").attr("value");
} else { return -; }
}
//选择节点事件
function onSelect(e) {
}
//选择节点事件
function onChecked(e) {
var treeView = $("#TreeView").data("tTreeView");
var value = treeView.getItemValue(e.item); //赋值
if (value == "") {        //根节点
if (e.checked == true) {
CheckAll();
} else {
UncheckAll();
}
} else {
if (e.checked == true) {
$(e.item).closest('li').find('.t-group').find(".t-item").each(function (i) { //关键代码
CheckItem(this);
});
} else {
$(e.item).closest('li').find('.t-group').find(".t-item").each(function (i) { //关键代码
UncheckItem(this);
});
}
}
}
//全选
function CheckAll() {
var treeView = $("#TreeView").data("tTreeView");
treeView.nodeCheck(".t-item", true);
}
//反选
function UncheckAll() {
var treeView = $("#TreeView").data("tTreeView");
treeView.nodeCheck(".t-item", false);
}
//单选
function CheckItem(item) {
var treeView = $("#TreeView").data("tTreeView");
treeView.nodeCheck(item, true);
}
//取消单选
function UncheckItem(item) {
var treeView = $("#TreeView").data("tTreeView");
treeView.nodeCheck(item, false);
}
</script>
}

[6]Telerik TreeView 复选框的更多相关文章

  1. MVC树控件,mvc中应用treeview,实现复选框树的多层级表单控件

    类似于多层级的角色与权限控制功能,用MVC实现MVC树控件,mvc中应用treeview,实现复选框树的多层级表单控件.最近我们的项目中需要用到树型菜单,以前使用WebForm时,树型菜单有微软提供的 ...

  2. WPF:带复选框CheckBox的树TreeView

    最近要用WPF写一个树,同事给了我一个Demo(不知道是从哪里找来的),我基本上就是参照了这个Demo. 先放一下效果图(3棵树): 这个树索要满足的条件是: 父节点.Checked=true时,子节 ...

  3. 关于bootstrap的treeview不显示多选(复选框)的问题,以及联动选择的问题,外加多选后取值

    最近做项目用到了treeview.因为涉及到多选的问题,很是棘手,于是乎,我决定查看原生JS,探个究竟.需要引用官方的bootstrap-treeview.js都知道吧,对于所需要引用的,我就不多说了 ...

  4. jquery Treeview插件的使用及复选框的级联

    本文是对jquery的Treeview插件使用的实例介绍 效果图如下: 文件结构如下:

  5. 实现带复选框的TreeView控件

    实现效果: 知识运用: TreeView控件的CheckView属性 //是否在树形视图控件中显示复选框 public bool CheckBoxs{ get;ser } 实现代码: TreeView ...

  6. 【Telerik】实现列表单元格中添加复选框,进行状态(是、否)判断

    前台界面: 需求:实现对每条细则是否必备进行判断,必备就勾选,否则不勾选. 首先:要保证列表GridView是可编辑的(IsReadOnly=false) 表格代码 其次:单元格的数据绑定要保证是双向 ...

  7. 给 TTreeView 添加复选框

    //1.引用单元 uses Commctrl ; //2.定义私有过程 procedure tvToggleCheckbox(TreeView: TTreeView;Node: TTreeNode;i ...

  8. Code-NFine:下来框和复选框

    ylbtech-Code-NFine:下来框和复选框 1.返回顶部 1. 1.1 html $("#F_OrganizeId").bindSelect({ url: "/ ...

  9. 学习 TTreeView [16] - 给 TTreeView 添加复选框 (回复 "丁永其" 的问题)

    问题来源: http://www.cnblogs.com/del/archive/2008/05/15/1114450.html#1199402 本例效果图: unit Unit1; interfac ...

随机推荐

  1. The system clock has been set back more than 24 hours

    由于破解调试需要,更改了系统时间,打开ArcMap会出现"The system clock has been set back more than 24 hours"的错误,原因是 ...

  2. SharePoint 2010 文档管理系列之星级评论功能

    前言:正如我们前面介绍的是,文档管理就是让大家更加直观.方便的对手里的文档,进行统筹掌控,哪些文档是有价值的,哪些文档更受大家欢迎,所有就带来了这个星级评论. 当然,这个是SharePoint 201 ...

  3. [leetcode] Rectangle Area

    Rectangle Area Find the total area covered by two rectilinear rectangles in a 2D plane. Each rectang ...

  4. 深入理解Android的startservice和bindservice

    一.首先,让我们确认下什么是service?         service就是android系统中的服务,它有这么几个特点:它无法与用户直接进行交互.它必须由用户或者其他程序显式的启动.它的优先级比 ...

  5. iOS 学习 - 6.Objective-C中的各种遍历(迭代)方式

    说明:转自文顶顶 一.使用 for 循环 要遍历字典.数组或者是集合,for 循环是最简单也用的比较多的方法 -(void)iteratorWithFor { //////////处理数组////// ...

  6. 如何轻松实现iOS9多任务管理器效果(iCarousel高级教程)

    前言 iOS9系统下 为了我司APP的兼容性问题 特意把手上的iOS Mac XCode都升级到了最新的beta版 然后发现iOS9的多任务管理器风格大变 变成了下面这种样子 我忽然想起来之前的文章提 ...

  7. 将struts源码导入eclipse

    预制条件和spring源码导入eclipse中一样,下面直接给出导入eclipse的步骤. 步骤: 1. 下载struts相应版本的源码 http://struts.apache.org/downlo ...

  8. iOS开源JSON解析库MJExtension

    iOS中JSON与NSObject互转有两种方式:1.iOS自带类NSJSONSerialization 2.第三方开源库SBJSON.JSONKit.MJExtension.项目中一直用MJExte ...

  9. 为Xcode添加和备份快捷代码

    有IOS开发经验的,相信你一定了解快捷代码的使用以及可以自定义代码,备份到XCode右下角,供下次使用. 那么,快捷代码备份到本地什么位置呢: 位置:~/Library/Developer/Xcode ...

  10. mysql由浅入深探究(一)----数据库简介与mysql安装

    mysql简介: 首先谈到mysql,我们要知道这是一个开源的数据库,与开源对应的就是free,但这并不意味着其性能会比很差,mysql同样能支持千万级以上的大数据量,甚至更多.同时mysql还支持许 ...