获取zTree选中节点

 <body>

     <script type="text/javascript">

         var setting = {

             view: {

                 dblClickExpand: false,

                 showLine: true,

             },

             check: {

                 enable: true,       //必选项

                 chkboxType: { "Y": "p", "N": "s" }, //Y被勾选,N没有勾选情况,p操作影响父节点,s影响子节点

             },

             data: {

                 simpleData: {

                     enable: true,

                     idKey: "id",

                     pIdKey: "pId",

                     rootPId:

                 }

             },

             callback: {

                 onCheck: onCheckNode    //回调函数,获取选节点

             }

         };

         var zNodes = [

         { id: , pId: , name: "[excheck] 复/单选框功能 演示", open: true },

         { id: , pId: , name: "Checkbox 勾选操作", file: "excheck/checkbox" },

         { id: , pId: , name: "Checkbox nocheck 演示", file: "excheck/checkbox_nocheck" },

         { id: , pId: , name: "Checkbox chkDisabled 演示", file: "excheck/checkbox_chkDisabled" },

         { id: , pId: , name: "Checkbox halfCheck 演示", file: "excheck/checkbox_halfCheck" },

         { id: , pId: , name: "Checkbox 勾选统计", file: "excheck/checkbox_count" },

         { id: , pId: , name: "用 zTree 方法 勾选 Checkbox", file: "excheck/checkbox_fun" },

         { id: , pId: , name: "Radio 勾选操作", file: "excheck/radio" },

         { id: , pId: , name: "Radio nocheck 演示", file: "excheck/radio_nocheck" },

         { id: , pId: , name: "Radio chkDisabled 演示", file: "excheck/radio_chkDisabled" },

         { id: , pId: , name: "Radio halfCheck 演示", file: "excheck/radio_halfCheck" },

         { id: , pId: , name: "用 zTree 方法 勾选 Radio", file: "excheck/radio_fun" }

         ];

         $(document).ready(function () {

             var treenode = $.fn.zTree.init($("#treeDemo"), setting, zNodes);

             $('#didClick').click(function () {

                 $.ajax({

                     url: '/handler/ajax.ashx',

                     type: 'POST',

                     async: true,

                     data: {

                         PostMethod:"checkedBox",

                         nodesJson: chkNodeStr

                     },

                     dataType: 'json',

                     success: function (data) {

                         console.log(data)

                     },

                     error: function (xhr, textStatus) {

                         console.log(xhr)

                         console.log(textStatus)

                     },

                 });

             });

         });

         var chkNodeArr;

         var chkNodeStr="";

         var nodeJson = [];

         function onCheckNode() {

             var treenode = $.fn.zTree.getZTreeObj("treeDemo");

             chkNodeArr = treenode.getCheckedNodes(true);    //true获取选中节点,false未选中节点,默认为true

             for (var i = ; i < chkNodeArr.length; i++) {

                 nodeJson[i] = { "name": chkNodeArr[i].name, "id": chkNodeArr[i].id };

             }

             //console.log(chkNodeArr);

             chkNodeStr = JSON.stringify(nodeJson);

         }

     </script>

      <div>

         <ul id="treeDemo" class="ztree"></ul>

          <button type="button" id="didClick">提交</button>

     </div>

 </body>

后台解析json字符串,使用Newtonsoft

1,引用 using Newtonsoft.Json.Linq;

2,因为是数组所以用JArray解析,对象可以用JObject

 if (method == "checkedBox") {

     string jsonStr = context.Request["nodesJson"];

     JArray ja = JArray.Parse(jsonStr);

     Dictionary<string, string> dic = new Dictionary<string, string>();

     foreach (JToken str in ja) {

         dic.Add(str["name"].ToString(),str["id"].ToString());

     }

 }

附上 zTree 官网 api 和 Newtonsoft.json 文档

　　

如何将zTree选中节点传递给后台的更多相关文章

  1. 通过ajax 后台传递的 区域id 选中ztree的节点 并展开节点

    代码如下: < script type = "text/javascript" >    var flag = "<%=request.getParam ...

  2. zTree勾选状态的禁用节点不在选中节点里

    问题描述: 由于业务需求,需要将一部分节点设置为选中并且是禁用的状态.设置这部分节点的chkDisabled和checked属性值都为true.在zTree树上这部分节点是选中且禁用的状态,但是在保存 ...

  3. ztree设置节点checked，选中某节点等相关操作

    ztree设置节点checked,选中某节点等相关操作 1.根据id获取树的某个节点: var zTree = $.fn.zTree.getZTreeObj("mytree"); ...

  4. zTree设置选中节点之后出现重复节点

    1.用户离开页面时最后一次点击的节点信息我会保存到数据库. 2.用户打开页面时默认选中上一次离开时选中的节点. 现在发现在设置选中节点之后,会出现重复的节点(重复现象偶尔出现). 以下是代码: var ...

  5. ztree 获取当前选中节点的子节点集合

    功能:获取当前选中节点的子节点id集合. 步骤:1.获取当前节点 2.用ztree的方法transformToArray()获取当前选中节点(含选中节点)的子节点对象集合. 3.遍历集合,取出需要的值 ...

  6. ztree获取选中节点

    $(document).ready(function(){ $.fn.zTree.init($("#treeDemo"), setting, zNodes); }); functi ...

  7. ztree获取选中节点时不能进入可视区域出现BUG如何解决

    zTree 是一个依靠 jQuery 实现的多功能 “树插件”.优异的性能.灵活的配置.多种功能的组合是 zTree 最大优点. zTree 的特点编辑 ● zTree v3.0 将核心代码按照功能进 ...

  8. 160420、zTree获取所有选中节点数据

    <!DOCTYPE html><HTML><HEAD> <TITLE> ZTREE DEMO - Standard Data </TITLE> ...

  9. ztree 获取CheckBox选中节点时，不获取选中上级父节点

    //将第三个参数改为false,表示不去勾选父节点下的所有子节点 zTreeObj.checkNode(node, true, false); setting.check.chkboxType = { ...

随机推荐

  1. VBA/VB6/VBS/VB.NET/C#/Python/PowerShell都能调用的API封装库

    API函数很强大,但是声明的时候比较繁琐. 我开发的封装库,包括窗口.键盘.鼠标.消息等常用功能.用户不需要添加API函数的声明,就可以用到API的功能. 在VBA.VB6的引用对话框中引用API.t ...

  2. 网站爬取-案例三：今日头条抓取(ajax抓取JS数据)

    今日头条这类的网站制作,从数据形式,CSS样式都是通过数据接口的样式来决定的,所以它的抓取方法和其他网页的抓取方法不太一样,对它的抓取需要抓取后台传来的JSON数据,先来看一下今日头条的源码结构:我们 ...

  3. maven setting.xml说明

    <?xml version="1.0" encoding="UTF-8"?> <settings xmlns="http://mav ...

  4. 59）PHP，管理员表中所存在的项

    用户ID 用户名 用户密码 用户权限(就是他的角色等级,比如是1级  2级,  三级等等) 上次登录的IP 上次登录的时间

  5. SecureCRT8.1安装破解

    博主本人平和谦逊,热爱学习,读者阅读过程中发现错误的地方,请帮忙指出,感激不尽 一.安装破解 [基本信息] SecureCRT v8.x 注册机,TEAM Z.W.T 出品,MD5 = 44114b9 ...

  6. mysql 数据库 创建用户和授权

    创建用户和密码 CREATE USER '用户名'@'%' IDENTIFIED BY '密码'; 创建几个数据库 例如 db1,db2 用户授权访问指定的数据库 grant all privileg ...

  7. 关于（int argc char **argv）

    演示使用opencv显示一幅图片: #include <iostream> #include <core/core.hpp> #include <highgui/high ...

  8. [LC] 24. Swap Nodes in Pairs

    Given a linked list, swap every two adjacent nodes and return its head. You may not modify the value ...

  9. SHELL用法八（Grep语句）

    1.SHELL编程Grep语句案例实战 1)Find是Linux操作系统文件和目录的路径检索.查询工具,而Grep是Linux系统下文本文件内容检索或者匹配工具,Grep称为全局正则表达式检索工具,在 ...

  10. 微软研究员Eric Horvitz解读 “人工智能百年研究”

    本文翻译自ScienceInsider"A 100-year study of artificial intelligence? Microsoft Research's Eric Horv ...