参考连接: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. An unexpected error has occurred" error appears when you try to create a SharePoint Enterprise Search Center on a Site Collection

    The Enterprise Search Center requires that the Publishing feature be enabled. To enable the Publishi ...

  2. 安卓开发-问题集-Description Resource Path Location TypeUnparsed aapt error(s)! Check the console for output.

    今天在安卓项目中 res-drawable-hdpi 替换图片的时候出现这个问题 问题现象为项目显示一个叉号,但是在项目内容的任何文件都不显示叉号, 搞了半天没发现是什么问题,然后就去项目的文件夹下 ...

  3. apache-virtual host

    NameVirtualHost xxx.xxx.xxx.xxx:80<VirtualHost xxx.xxx.xxx.xxx:80>        ServerName xxx.xxx.x ...

  4. [android] 手机卫士界面切换动画

    在/res/anim/ 建立文件tran_out.xml 添加<translate>节点 设置x轴来源坐标android:fromXDelta=”0” 设置x轴目的坐标android:to ...

  5. C语言-10-位域与共用体

    位域 在某种特定情况下,一个结构体中的多个变量只使用各自存储空间的几位,而其他位从来不使用.这种情况下,可以使用位域来限定每个变量的用来存储数据的位宽. 作用 限定结构体中变量用来存放数据的位宽,即使 ...

  6. 基于git的工作流程

    本文针对的是追求极致.快速的产品响应团队的.以下的观点和内容都是围绕这个主题,暂时不涉及个人学习和团队学习. 在说工作流程之间,想说一下我们平常工作中遇到的一些困惑或者说现象 在一个团队里,同时有好多 ...

  7. 深入PHP内核之ZVAL

    一.PHP的变量类型 PHP的变量类型有8种: 标准类型:布尔boolen,整型integer,浮点float,字符string 复杂类型:数组array,对象object 特殊类型:资源resour ...

  8. Web Service中的几个重要术语

    WSDL:web service definition language 直译:WebService定义语言 1.对应一种该类型的文件.WSDL 2.定义了Web Service的服务器与客户端应用交 ...

  9. MongodbBackup Script

    #!/usr/bin/env python # _*_coding:utf-8_*_ # Author: "Edward.Liu" # Author-Email: lonnyliu ...

  10. poj 1144 Network 图的割顶判断模板

    Network Time Limit: 1000MS   Memory Limit: 10000K Total Submissions: 8797   Accepted: 4116 Descripti ...