如何实现jstree-actions

时间:2018-01-18 19:14:45

标签: javascript jstree

我有以下疑问,因为我刚刚开始使用jstree 我看到jstree-actions.js有一个功能但我无法实现它这是我的代码 非常感谢您的帮助



<link href="~/Content/jsTree/themes/default/style.css" rel="stylesheet" />
<script src="~/Scripts/jquery-1.10.2.js"></script>
<script src="~/Scripts/jsTree3/jstree.js"></script>
<script src="~/Scripts/jsTree3/jstree-actions.min.js"></script>
<script>

    $(function () {
        $('#container').jstree({
            'core': {
                "animation": 0,
                "themes": { "stripes": true },
                'data': {
                    'url': B3.Tools.GetRootUrl() + '/jsTree3/GetJsTree3Data?empresa=' + B3.Tools.ObtenerEmpresa('empresa'),
                    'dataType': 'json'
                }

            }
        });

//This is the code that I could not implement

        container.jstree(true).add_action("1", {
            "id": "action_add",
            "class": "action_add pull-right",
            "title": "Add Child",
	        "text": "",
            "after": true,
            "selector": "a",
            "event": "click",
            "callback": function (node_id, node, action_id, action_el) {
                console.log("callback", node_id, action_id);
            }
        });

    });


    
</script>

<div id="container"></div>
&#13;
&#13;
&#13;

1 个答案:

答案 0 :(得分:0)

这是实现jstree.actions插件的方式。确保存在类图标action_add

     <script>

        $(function () {
            $('#container').jstree({
                'core': {
                    "animation": 0,
                    "themes": { "stripes": true },
                    'data': {
                        'url': B3.Tools.GetRootUrl() + '/jsTree3/GetJsTree3Data?empresa=' + B3.Tools.ObtenerEmpresa('empresa'),
                        'dataType': 'json'
                    }

                }
            })
            .jstree(true).add_action("1", {
                "id": "action_add",
                "class": "action_add pull-right",
                "title": "Add Child",
                "text": "Edit",
                "after": true,
                "selector": "a",
                "event": "click",
                "callback": function (node_id, node, action_id, action_el) {
                    console.log("callback", node_id, action_id);
                }
            });

        });

    </script>