ztree指定节点设置复选框

首先，需引入ztree的js文件

<script src="../../assets/ztree/js/jquery.ztree.core-3.5.min.js"></script>
<script src="../../assets/ztree/js/jquery.ztree.excheck-3.5.min.js"></script>

在请求接口成功的情况下初始化：

$.fn.zTree.init($("#tree"), Setting, data);

第一个参数为插件固定的ID，setting为树的相关配置比如（添加复选框，是否多选，相关回调），data为后台返回的ztree数据。

setting设置：


var Setting = {data: {            //这里不动simpleData: {enable: true,idKey: "id",pidKey: "pId",rootPid: '-1'}},check: {enable: true,     //这里设置是否显示复选框chkboxType: { "Y": "", "N": "" }      //设置复选框是否与 父/子 级相关联},view: {showIcon: false    //禁止多选},callback: {onCheck: zTreeOnCheck,         //点击复选框相关回调（回调名称固定）beforeCheck : function(treeId, treeNode) {      //选择复选框前相关回调if (treeNode.isParent) {if(treeNode.myAttr !== "1"){ //判断是否是需要显示复选框的节点treeNode.nocheck = true;   //设置复选框不显示}return false;}}}
};

在初始化的时候就设置除了指定节点需要复选框，其他不显示复选框

var zTree = $.fn.zTree.getZTreeObj("tree"),       // 获取ztree对象node = zTree.getNodes(),      //获取根节点nodes = zTree.transformToArray(node);    //遍历所有节点
if(nodes.length>0){for(var i=0;i<nodes.length;i++){if(nodes[i].myAttr !== "1"){         //判断需要显示复选框的条件nodes[i].nocheck=true;              //nocheck为true表示没有选择框zTree.updateNode(nodes[i]);         //刷新}}
}
zTree.setting.callback.onCheck(zTree, zTree.setting.treeId, node); // 调用回调
zTree.setting.callback.beforeCheck(zTree.setting.treeId, node);

function zTreeOnCheck(zTree, treeId, treeNode) {try{if(treeNode.myAttr == "1"){if(treeNode.checked){treeNode.getParentNode().checked = false;}}else{treeNode.checked = false;}}catch(e){$.showAlert('error',"无查找结果");}}

获取被选中的某某值

 $("#get").click(function(){var dataNodes = "",nodes = zTree.getCheckedNodes(true);if(0 === nodes.length) {alert("请选择!");return;}for(var i = 0; i < nodes.length; i++) {dataNodes += nodes[i].id + "|";}alert(dataNodes);
})

其他参考https://blog.csdn.net/lyyxp/article/details/50846690###;

一般情况下，通过zTree官方API的方法获取得到的是一个包含所有子节点的根节点（子节点都处于 children 属性下）

var treeObj = $.fn.zTree.getZTreeObj(“tree");
var nodes = treeObj.getNodes();

当我们需要一次获取所有树节点的时候，有两种方法：
一种是通过递归的方式（此处就不提及了）。
另一种就是通过zTreet提供的方法：

     var treeObj = $.fn.zTree.getZTreeObj(”tree“);var node = treeObj.getNodes();var nodes = treeObj.transformToArray(node);

这种方法得到的就是整颗树的所有节点集合

Ztree 树插件树节点名称太长的解决方案(给背景div加滚动条):https://www.cnblogs.com/danywdd/p/5588136.html

使用省略号方法：使用addDiyDom http://blog.csdn.net/zhengbo0/article/details/17759543

 var setting = {view: {addDiyDom: addDiyDom}};function addDiyDom(treeId, treeNode) {var spaceWidth = 5;var switchObj = $("#" + treeNode.tId + "_switch"),icoObj = $("#" + treeNode.tId + "_ico");switchObj.remove();icoObj.parent().before(switchObj);var spantxt = $("#" + treeNode.tId + "_span").html();if (spantxt.length > 17) {spantxt = spantxt.substring(0, 17) + "...";$("#" + treeNode.tId + "_span").html(spantxt);}}

**有checkbox时**
function addDiyDom(treeId, treeNode) {var spaceWidth = 5;var switchObj = $("#" + treeNode.tId + "_switch"),checkObj = $("#" + treeNode.tId + "_check"),icoObj = $("#" + treeNode.tId + "_ico");switchObj.remove();checkObj.remove();icoObj.parent().before(switchObj);icoObj.parent().before(checkObj);var spantxt = $("#" + treeNode.tId + "_span").html();if (spantxt.length > 17) {spantxt = spantxt.substring(0, 17) + "...";$("#" + treeNode.tId + "_span").html(spantxt);}}

另外，设置node节点checked选中,有两种方法实现:
（1）、zTree.checkNode(node, true, true);
（2）、node.checked = true;

取消当前所有被选中节点的选中状态

var treeObj = $.fn.zTree.getZTreeObj("tree");
treeObj.cancelSelectedNode();

取消当前第一个被选中节点的选中状态

var treeObj = $.fn.zTree.getZTreeObj("tree");
var nodes = treeObj.getSelectedNodes();
if (nodes.length>0) { treeObj.cancelSelectedNode(nodes[0]);
}

详情看ztree API [ztree API](http://www.treejs.cn/v3/api.php

回复资料获得视频资料

ztree指定节点设置复选框相关推荐

QTreeView 动态设置复选框
目录动态设置复选框的步骤 QT MVC的概念模型添加数据获取数据视图槽函数动态设置复选框的步骤初始化一个QTreeView 的界面,并设置相关的model // 在ui中新建两个QTr ...
PyQt5 技巧篇-复选框绑定行内容，全选、清空、展示选中的内容功能实现演示，设置复选框选中，检查复选框选中状态
先看效果图,选中了几行,然后将选中的内容展示出来. 我设置两个有序序列,分别存储对应的复选框和行内容. 我的行内容是用的 label 标签. # 存储右边label组件的有序列表def get_L_b ...
HTML如何设置复选框、单选框以及默认选项？
本篇文章主要给大家介绍HTML怎么设置复选框以及单选框的. 我们在网站开发过程中,有时会需要实现类似调查问卷的功能,那么既然是问卷,就避免不了单选或者多选的情况.对于新手朋友来说,或许不太清楚. 下面 ...
Java 根据模板导出Excel时，如何根据后台数据设置复选框的勾选
我之前遇到这个问题,上网查找解决方案.都说要在Excel中设置复选框的链接单元格,然后通过赋值给单元格控制复选框的勾选. 在我设置好链接单元格之后,点击复选框,单元格中的值会改变 TRUE 或 FAL ...
php调查问卷单选框标题,word调查问卷制作：怎样设置复选框各单选框
在信息自动化的时代下,为了向用户了解和采集一些基本信息,经常会使用电子调查问卷收集所需数据,采用这种形式无疑比以往的纸质调查问卷更为快捷方便. 而在电子调查问卷中,让我们最为熟悉的就是针对各种问题设定 ...
设置复选框选中及其使用
设置复选框选中及其使用开发工具与关键技术:VS .MVC 撰写时间:2019/7/26 有一些需要就在你触发某个按钮的时候,单选框或者复选框就是一个选中的状态,并且要记录这个状态的时候:页面的复选框 ...
【zTree小贴士】复选框设置了：check:{ enable: true }，页面却没显示复选框
问题: 复选框设置了:check:{ enable: true },页面却没显示复选框可能的原因: 没有引入所需的js 解决方案: 引入jquery.ztree.excheck.min.j ...
用java设置复选框_Java Swing组件复选框JCheckBox用法示例
这篇文章主要介绍了Java Swing组件复选框JCheckBox用法,结合具体实例形式分析了Swing复选框JCheckBox简单用法与相关操作注意事项,需要的朋友可以参考下本文实例讲述了Java ...
jquery设置复选框为只读_checkbox设置复选框的只读效果不让用户勾选
在Web开发中,有时候需要显示一些复选框(checkbox),表明这个地方是可以进行勾选操作的,但是有时候是只想告知用户"这个地方是可以进行勾选操作的"而不想让用户在此处勾选(比如 ...

ztree指定节点设置复选框

ztree指定节点设置复选框相关推荐

最新文章

热门文章

ztree指定节点 设置复选框

ztree指定节点 设置复选框相关推荐

最新文章

热门文章

ztree指定节点设置复选框

ztree指定节点设置复选框相关推荐