1

Tengo la siguiente función:

function search(e) {
    console.log('click')
    console.log(e.target.value)
    let value = e.target.value;
    let all = document.querySelectorAll("tr[data-keywords]");

    for (let i = 0; i < all.length; i++) {
      let keywords = all[i].getAttribute("data-keywords");

      let match = keywords.indexOf(value);

      if (match === -1) {
        all[i].style.display = "none";
      } else {
        all[i].style.display = "";
      }
    }

}

document.getElementById("search-bar").addEventListener("keydown", search);

Necesito obtener el valor de un input para hacer una búsqueda dinámica en una lista con cada tecla presionada. Este es mi input:

<input type="text" placeholder="Busca envento..." id="search-bar">

El problema está en que e.target.value me devuelve el valor desactualizado. Por ejemplo, cuando ingreso una letra console.log(e.target.value) está vacío, luego con la segunda sólo imprime la primera.

introducir la descripción de la imagen aquí

¿Hay alguna forma de obtener el valor actualizado?

Agradecería mucho si me ayudaran. Ya he buscado en muchos sitios.

0

1 respuesta 1

2

En lugar de al evento keydown, enganchate al evento change

document.getElementById("search-bar").addEventListener("change", search);

El evento keydown se lanza, como indica su nombre, al pulsar una tecla, pero antes de soltarla. Con lo cual estás pidiendo el contenido antes de que realmente se produzca la alteración del mismo.

Nota: También pueden consultar el evento input

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge you have read our privacy policy.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.