• 带CheckBox的dojo Tree简单实现,并实现级联选取


    dojo自带的Tree不能实现CheckBox选取节点功能,第三方cbtree过于复杂,因此自己写了个简单的实现,能够实现子节点级联父节点直到根节点,父节点选取全选子节点的功能,但没有写父节点取消时的子节点取消,代码如下,大家可以自行拷贝修改

    function createMenuTree() {
                require(["dojo/request",
                   "dojo/store/Memory",
                   "dijit/tree/ObjectStoreModel",
                   "dijit/Tree"], function (request, Memory, ObjectStoreModel, Tree) {
                       request("/Role/Menus/", { handleAs: "json", preventCache: true }).then(function (data1) {
    
                           for (var i = 0; i < data1.length; i++) {
                               data1[i].checked = false;
                           }
    
                           menuStore = new Memory({
                               idProperty: "PID",
                               data: data1,
                               getChildren: function (object) {
                                   return this.query({ PPARENT: object.PID });
                               }
                           });
    
                           menuModel = new ObjectStoreModel({
                               store: menuStore,
                               labelAttr: "PNAME",
                               query: { PID: "Menu" },
                               mayHaveChildren: function (item) {
                                   var subs = menuStore .query({ "PPARENT": item.PID });
                                   return subs.length > 0;
                               }
                           });
    
                           menuTree = new Tree({
                               model: menuModel,
                               autoExpand:true,
                               onClick: function (item, node, evt) {
                                   console.debug(menuTree.paths);
                                  
                                   var selCb = dojo.byId("pjtchk"+item.PID);
                                   if (selCb == null) { return; }
                                   if (!dojo.hasAttr(selCb, "checked")) {
                                       node.labelNode.innerHTML = "<input id='pjtchk" + item.PID + "' checked type='checkbox' />" + item.PNAME;
                                       selectUppers(item.PID);
                                       selectSubs(item.PID);
                                   } else { node.labelNode.innerHTML = "<input id='pjtchk" + item.PID + "' type='checkbox' />" + item.PNAME; }
                               },
                               _createTreeNode: function (/*Object*/args) {
                                   var tnode = new dijit._TreeNode(args);
                                   tnode.labelNode.innerHTML = "<input id='pjtchk" + args.item.PID + "' type='checkbox' />" + args.label;
                                   return tnode;
                               }
                           });
                           
                           menuTree.placeAt($("menuTree"));
                           menuTree.startup();
                       });
                   });
            }
    
     
    
    function selectUppers(id) {
                var sMenus = menuStore.query({ PID: id });
                if (sMenus != null && sMenus.length > 0) {
                    var cb = $("pjtchk" + id);
                    if (cb != null) {
                        dojo.attr(cb, 'checked', true);
                        selectUppers(sMenus[0].PPARENT);
                    }
                }
            }
    
            function selectSubs(id) {
                var sMenus = menuStore.query({ PID: id });
                if (sMenus != null && sMenus.length > 0) {
                    var cb = $("pjtchk" + id);
                    if (cb != null) {
                        dojo.attr(cb, 'checked', true);
                    }
                }
               
                var menus = menuStore.query({ PPARENT: id });
                if (menus != null && menus.length > 0) {
                    dojo.forEach(menus, function (menu) {
                        selectSubs(menu.PID);
                    });
                }
            }
  • 相关阅读:
    nodejs游戏服务器开发(二)---mysql连接
    nodejs游戏服务器开发(一)---socket连接
    《Metasploit渗透测试指南》命令参考列表
    Nmap脚本使用总结(转乌云) 下
    Nmap的介绍和使用(乌云转) 上
    局域网win7系统:虚拟机kali 做端口映射
    漏洞检测的几种方法
    BurpSuite 1.6.27 最新破解版操作
    Metasploit基础
    龙灵:特邀国内第一讲师“玄魂” 在线培训黑客神器Kali Linux
  • 原文地址:https://www.cnblogs.com/dojoblog/p/4023861.html
Copyright © 2020-2023  润新知