Jstree点击,双击,样式,用法

调用的样式
/jstree/3.3.3/themes/default/style.min.css
/jquery-treegrid/0.3.0/css/jquery.treegrid.css
/jstree/3.3.3/jstree.min.js
/bootstrap-select/1.12.0/css/bootstrap-select.min.css
/bootstrap-select/1.12.0/js/bootstrap-select.min.js
/jquery-treegrid/0.3.0/js/jquery.treegrid.min.js
/jquery-treegrid/0.3.0/js/jquery.treegrid.min.js
 //清空jstree缓存   调用ajax
        $('#tree_4').data('jstree', false).empty();
 //单击触发事件
        $('#tree_3').bind("activate_node.jstree", function(obj, e) {
            // 处理代码
            // 获取当前节点
            $("#form").hide();
            var currentNode = e.node;
            id = currentNode.id;
            parent = currentNode.parent;
            text = currentNode.text;

        });

//右键触发事件

        var customMenu = function(data) {
            $('#selector1').selectpicker('refresh');
            var divD = document.getElementById("selectHide");
            $("#cf_parentId").val(id);
            if (parent == "#") {
                $('#cf_functionValue').hide();
                divD.style.display = "block";
            } else {
                $('#cf_functionValue').val('');
                divD.style.display = "none";
                $('#cf_functionValue').show();
               
            }
            $("#form").show();
            if (parent == "0" || parent == "#") {
                $("#lableButton").hide();

                $("#lableMenu").show();

//使用prop替换 效果更好

                $(":radio[name='type'][value='menu']").prop("checked", "checked");
            } else {
                $("#lableMenu").hide();
                $("#lableButton").show();
                $(":radio[name='type'][value='button']").prop("checked", "checked");
            }
          
        }

//前端js
 $("#tree_3").jstree({
                    "core" : {
                        "themes" : {
                            "responsive" : false
                        },

                        "check_callback" : true,

//后面的data是根据ajax传过来的json数据

                        "data" : data
                    },
                    "types" : {
                        "default" : {
                            "icon" : "fa fa-folder icon-state-warning icon-lg"
                        },
                        "file" : {
                            "icon" : "fa fa-file icon-state-warning icon-lg"
                        }
                    },
                    "plugins" : [ "contextmenu", "types" ],
                    "contextmenu" : {
                        "items" : {
                            "newxuanxian" : {
                                "label" : "添加此目录下权限",
                                "action" : customMenu,
                            }
                        }
                    }
                }).on('changed.jstree', function (e, data) {     
                                            var parentIdValue = data.instance.get_node(data.selected[0]).id;
                                            $("#editForm #ef_parentId").val(parentIdValue);
                                         });

//后台代码

  list = iFunctionMapper.findFunctionSecondMenu();
            Map<String, Boolean> json1 = new HashMap<>();
            json1.put("selected", true);
            Map<String, Boolean> json2 = new HashMap<>();
            json2.put("opened", true);
            Map<String, Object> json = new HashMap<>();
            json.put("text", "根节点");
            json.put("id", "0");
            json.put("parent", "#");
            json.put("state", json2);
            getValue.add(json);
            for (int i = 0; i < list.size(); i++) {
                Map<String, Object> jsonObject = new HashMap<>();
                jsonObject.put("text", list.get(i).getFunctionName());
                jsonObject.put("id", list.get(i).getId());
                jsonObject.put("state", json2);
                String parentId;
                // parentId为空时,属于二级菜单目录
                if ("".equals(list.get(i).getParentId()) || null == list.get(i).getParentId()) {
                    parentId = "0";
                } else {
                    parentId = list.get(i).getParentId();
                }
                jsonObject.put("parent", parentId);
                getValue.add(jsonObject);
            }


  $('#selector1').selectpicker('refresh');
            var ComponentsBootstrapSelect = function() {
                var n = function() {
                    $(".bs-select").selectpicker({
                        iconBase: "fa",
                        tickIcon: "fa-check"
                    })
                };
                return {
                    init: function() {
                        n()
                    }
                }
            } ();
            App.isAngularJsApp() === !1 && jQuery(document).ready(function() {
                ComponentsBootstrapSelect.init()
            });
//加权限值图标
<div id="selectHide">
<select class="bs-select form-control" id="selector1" data-show-subtext="true" οnchange="document.createForm.functionValue.value=this.value">
<option value="">请选择权限图标</option>
<option data-icon="icon-diamond" value="icon-diamond">Mustard</option>
<option data-icon="icon-settings" value="icon-settings">Ketchup</option>
<option data-icon="icon-bulb" value="icon-bulb">Relish</option>
<option data-icon="icon-puzzle" value="icon-puzzle">Mayonnaise</option>
<option data-icon="icon-user" value="icon-user">Barbecue Sauce</option>
</select>
</div>
  • 0
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值