diff --git a/js/tree.js b/js/tree.js index aa0bc4369dc3e4ef5ef8d9f7b235aba3ce670851..8e1d19ad58ac43033cb8ece24e80d31619700018 100644 --- a/js/tree.js +++ b/js/tree.js @@ -20,30 +20,38 @@ $('.taxonomy-manager-autocomplete-input').show(); return true; }); - // Handle click on autocomplete suggestion - $(once('input', '.ui-autocomplete', context)).on('click', function (e) { - e.stopPropagation(); - var tidMatch = $('input[name="search_terms"]').val().match(/\([0-9]*\)/g) - if (tidMatch.length) { - var tid = parseInt(tidMatch[0].replace(/^[^0-9]+/, ''), 10); - // Request tree keys to activate via ajax. - $.ajax({ - url: Drupal.url('taxonomy_manager/subtree/child-parents'), - dataType: 'json', - data: { - 'tid': tid - }, - success: function (termData) { - var $tree = $("#edit-taxonomy-manager-tree").fancytree("getTree"); - var path = termData.path; - $tree.loadKeyPath(path).progress(function (keyData) { - if (keyData.status === 'ok') { - $tree.activateKey(keyData.node.key); - } - }); - } - }); - } + + once('input','input[name="search_terms"]', context).forEach(value => { + const uiAutocomplete = $(value); + + //Bind the autocomplete widget to the input field + // @see https://api.jqueryui.com/autocomplete/#event-select + uiAutocomplete.bind('autocompleteselect', (event, ui) => { + event.stopPropagation(); + const tidMatch = ui.item.value.match(/\([0-9]*\)/g) + if (tidMatch.length) { + const tid = parseInt(tidMatch[0].replace(/^[^0-9]+/, ''), 10); + $.ajax({ + url: Drupal.url('taxonomy_manager/subtree/child-parents'), + dataType: 'json', + data: { + 'tid': tid + }, + success: termData => { + const $tree = $("#edit-taxonomy-manager-tree").fancytree("getTree"); + const path = termData.path; + $tree.loadKeyPath(path).progress(keyData => { + if (keyData.status === 'ok') { + $tree.activateKey(keyData.node.key); + } + }); + }, + error: (jqXHR, textStatus, errorThrown) => { + console.error(`Request failed: ${textStatus}, ${errorThrown}`); + } + }); + } + }); }); } };