I made a input search bar where everything works. I search a GIF and it brings the results, when i search another gif y reomves all and brings the new results. The problem I have is when i try to select a suggestion (autocomplete) it doesnt bring it to the input search bar, so i can make that search. It changes the class of de div ("onClick", "select(this);), but when I press the suggestion it doesnt work the Onclick. Thanks
HTML .
</div>
<div class="sug sug2" id="sugg2">
<a href="#" target="_blank"><img class="lupaSug" src="assets/icon-search.svg" alt="#"></a>
<a class="jsSug" href=""></a>
</div>
<div class="sug sug3"id="sugg3">
<a href="" target="_blank"><img class="lupaSug" src="assets/icon-search.svg" alt="#"></a>
<a class="jsSug" href=""></a>
</div>
<div class="sug sug4" id="sugg4">
<a href="" target="_blank"><img class="lupaSug" id="lupaSug" src="assets/icon-search.svg"
alt="#"></a>
<a class="jsSug" href=""></a>
</div>
</div>
JS
/////////// INPUT SEARCH y SUGERENCIAS////////
let searchInput = document.getElementById('searchInput');
let suggDiv = document.getElementById('suggestion');
let suggestion = document.getElementsByClassName('jsSug');
let results = document.getElementById("results");
let searchString = "";// se carga el valor que se vaya tipeando en el input search.
let indexS = 0;
let suggestDataIndex = []; // se cargan en este¿a variable el array de las sugerencias desde la funcion searchSugg();
////// KEYPRESS SUGERENCIAS Y BUSQUEDA DE GIFOS////////
searchInput.addEventListener("keyup", (e) => {
searchString = e.target.value;
console.log(searchString);
// IF PRESS ENTER
if (e.key === 'Enter') {
// TRAE LOS RESULTADOS DE LOS GIF BUSCADOS//
gifoResult();
// me vacia el input
document.getElementById('searchInput').value = "";
// me hace unfocus en el input
document.getElementById("searchInput").blur();
// me remueve el resultado anterior de GIF, titulo y ver mas
document.getElementById('gifosGrid').remove();
document.getElementById('titleSearch').remove();
document.getElementById('seeMore').remove();
}
else {/// ELSE LLAMA A SUGGESTIONS
searchSugg();
/// FUNCION SI APRIETA UNA SUGERENCIA
for (let index = 0; index < suggestion.length; index++) {
suggestion[index].setAttribute("onClick", "select(this);");
console.log(suggestion[index]);
}
});
function select(element) {
let selectUserData = element.textContent;
console.log(selectUserData);
//searchInput.value = selectUserData;
}