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

问题:

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

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

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

实现效果:

aaarticlea/png;base64,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" 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. Atitit.office word  excel  ppt pdf 的web在线预览方案与html转换方案 attilax 总结

    Atitit.office word  excel  ppt pdf 的web在线预览方案与html转换方案 attilax 总结 1. office word  excel pdf 的web预览要求 ...

  2. Uploading Files in SharePoint 2013 using CSOM and REST

    http://www.shillier.com/archive/2013/03/26/uploading-files-in-sharepoint-2013-using-csom-and-rest.as ...

  3. 安卓开发_浅谈ContextMenu(上下文菜单)

    长下文菜单,即长按view显示一个菜单栏 与OptionMenu的区别OptionMenu对应的是activity,一个activity只能拥有一个选项菜单ContextMenu对应的是View,每个 ...

  4. IOS字典NSDictionary与NSMutableDictionary知识点

    字典中的元素是以键值对的形式存储的,键值对的键和值,都是任意的对象,但是键往往使用字符串,字典存储对象的地址没有顺序,字典的遍历分为:键的遍历和值的遍历,字典与数组的区别:数组讲究顺序,而字典可以快速 ...

  5. 【读书笔记】iOS-UIWindow-WindowLevel

    WindowLevel是UIWindow的一个属性.系统定义的一共有3种. UIKIT_EXTERN const UIWindowLevel UIWindowLevelNormal; UIKIT_EX ...

  6. SSH整合简述一

    1.web.xml中配置 struts2过滤器 <filter> <filter-name>struts2</filter-name> <filter-cla ...

  7. iOS UIWebView和网页的交互(OC中调执行JS)

    UIWebView和网页的交互(OC中调执行JS)- (void)viewDidLoad{[super viewDidLoad];// 1.webViewUIWebView *webView = [[ ...

  8. Resharper注册机实现以及源代码

    一直用Resharper,每次找注册机也麻烦,就想怎么才能自己能做个注册机,把它原理给搞懂了,不就不用找了.今天早上起来研究了下Resharper注册机,网上找到一位大神之前做Resharper注册机 ...

  9. android 5.X之使用Palette

    这几天为了学些android5.0版本sdk的新特性,折腾了好久.AndroidStudio被我反复的安装又卸载又安装,在eclipse和AndroidStudio 之间来回折腾.没想到sdk升级到5 ...

  10. 【转】PaxosLease算法--2PC看Paxos选主

    原文请参考[[置顶] Paxos master选举--PaxosLease算法] 众所周知,为了避免Paxos算法的活锁问题,必须选举唯一的proposor.偏偏在Paxos原论文中,作者L. Lam ...