Добавление автозаполнения во входной узел jstree - PullRequest
0 голосов
/ 29 марта 2019

Я создаю JsTree, у которого есть поле ввода Node.Я хочу включить автозаполнение для этого поля ввода.Приложение находится в 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();
                },

1 Ответ

1 голос
/ 07 апреля 2019

Лучшим подходом было бы написать свой собственный плагин jsTree.Возможно, вы можете подключить событие keydown jsTree для поля редактирования, чтобы заполнить ваш список элементов как предложение автозаполнения и использовать функцию автозаполнения пользовательского интерфейса jQuery.

.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

...