jorgchart,帮助你生成组织结构图的

Posted 小小强学习网

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了jorgchart,帮助你生成组织结构图的相关的知识,希望对你有一定的参考价值。

下载地址:

http://yunpan.cn/c6pfenkmmFV2q  访问密码 8e29

 

演示链接:

http://www.gbtags.com/gb/share/546.htm


jstree.js 也是一种层级机构的js控件
例子:
      var contextualMenuSample = function() {
            $("#tree_3").jstree({
                "core" : {
                    "themes" : {
                        "responsive": false
                    },
                    // so that create works
                    "check_callback" : true,
                    ‘data‘ : {
                        ‘url‘ : function (node) {
                            return "/departmentlist/companyid/"+companyid;
                        },
                        ‘data‘ : function (node) {
                            return { ‘parent‘:node.id};
                        }
                    }
                },
                "types" : {
                    "default" : {
                        "icon" : "fa fa-folder icon-state-warning icon-lg"
                    },
                    "file" : {
                        "icon" : "fa fa-file icon-state-warning icon-lg"
                    }
                },
                "state" : { "key" : "demo2" },
                "plugins" : [ "contextmenu", "dnd", "state", "types" ],
                "contextmenu": {
                    "items": {
                        "remove": null,
                        "ccp": null,
                        "add": {
                            "label": "新增",
                            "action": function (obj) {
                                var inst = jQuery.jstree.reference(obj.reference);
                                var clickedNode = inst.get_node(obj.reference);
                                addgory(clickedNode.id);
                                /*alert("add operation--clickedNode‘s id is:" + clickedNode.id);*/
                            }
                        },
                        "rename": {
                            "label": "编辑",
                            "action": function (obj) {
                                var inst = jQuery.jstree.reference(obj.reference);
                                var clickedNode = inst.get_node(obj.reference);
                                editgory(clickedNode.id);
                                /*alert("add operation--clickedNode‘s id is:" + clickedNode.id);*/
                            }
                         },
                        "create": {
                            "label": "查看员工",
                            "action": function (obj) {
                                var inst = jQuery.jstree.reference(obj.reference);
                                var clickedNode = inst.get_node(obj.reference);
                                look_yg(clickedNode.id)
                                //editgory(clickedNode.id);
                                /*alert("add operation--clickedNode‘s id is:" + clickedNode.id);*/
                            }
                        },
                        "delete": {
                            "label": "删除",
                            "action": function (obj) {
                                var inst = jQuery.jstree.reference(obj.reference);
                                var clickedNode = inst.get_node(obj.reference);
                                delgory(clickedNode.id);
                               // alert("delete operation--clickedNode‘s id is:" + clickedNode.id);
                            }
                        }
                    }
                }
            });

        };

        jQuery(document).ready(function() {
            Metronic.init(); // init metronic core components
            Demo.init(); // init demo features
            contextualMenuSample();
//            UITree.init();
        });

  

以上是关于jorgchart,帮助你生成组织结构图的的主要内容,如果未能解决你的问题,请参考以下文章

利用JOrgChart只需2分钟即可配置简单组织机构图

组织架构树形图

使用jOrgChart实现带有头像的组织架构图

Angularjs 组织结构图指令

Azure 机器人微软Azure Bot 编辑器系列 : 机器人/用户提问回答模式,机器人从API获取响应并组织答案 (The Bot Framework Composer tutorial(代码片段

如何更好地组织最小 WEB API 代码结构