将自动完成添加到 jstree 输入节点答案

【问题标题】：Adding auto complete to jstree input node将自动完成添加到 jstree 输入节点
【发布时间】：2019-03-29 12:39:22
【问题描述】：

我正在创建一个具有输入框节点的 JsTree。我想为此输入框启用自动完成功能。该应用程序在 angular4 中，但我用于创建 jstree 的文件是一个 .js 文件。

inst.create_node(obj, {
li_attr : {
                            'class' : 'child-menu listener-menu'
                        },
                        a_attr:{
                            'ondragover' : 'allowDropSR(event,"widgets")',
                            'ondrop' : 'dropSR(event,"widgets")'
                        },
                        text : "<span>Enter Country here</span>"
                    },
                     "last", function(new_node) {
                        new_node.data = {
                                file : true,
                                stopDrilldown : true,
                                hasParent : true
                        };
                        setTimeout(function () {
                            inst.edit(new_node);
                            $('.jstree-rename-input').attr();
                        },0);

                    });
                    $('.widget-list-tab a').tab('show');
                    $('.jstree-clicked').next('ul').find('li:last').find('a').focus();
                },

【问题讨论】：

标签： javascript angular autocomplete jstree

【解决方案1】：

最好的方法是编写自己的 jsTree 插件。您可以将 jsTree 的 keydown 事件挂接到编辑框，以将您的项目列表填充为自动完成建议并使用 jQuery UI 自动完成功能。

.bind("keydown.jstree", function(e) {
    if(e.target.tagName && e.target.tagName.toLowerCase() === "input" 
    && e.target.className.toLowerCase() === "jstree-rename-input" ) { 
        $(".jstree-rename-input").autocomplete({
            // AJAX can be used for list here
            source: countries
        });
    }
});

国家：是列表建议。

您可以在https://everyething.com/jsTree-with-AutoComplete-Box查看更多详细信息

【讨论】：

非常感谢..这正是我想要的。