Ya estoy inscrito ¿Todavía no tienes acceso? Nuestros Planes
Ya estoy inscrito ¿Todavía no tienes acceso? Nuestros Planes
1
respuesta

Creando la lógica de filtros

Ingrese aquí la descripción de esta imagen para ayudar con la accesibilidad

// VARIABLES -------------------->
var inputFiltro = document.querySelector("#filtrar-tabla");

// FUNCIONES -------------------->
inputFiltro.addEventListener("input", function(){
  console.log("--> Input pensanding");
  console.log(this.value);

  var pacientes = document.querySelectorAll(".paciente");

  if (this.value.length > 0) { // si el usuario introdujo texto:
  for (var i = 0; i < pacientes.length; i++){
    var paciente = pacientes[i];
    var tdNombre = paciente.querySelector(".info-nombre");
    var nombre= tdNombre.textContent; // nombre tomado del paciente en 'x' índice del loop.

      if(nombre != this.value) { // si es el nombre no es igual al escrito por el usuario en input hazlo invisible
        paciente.classList.add("invisible");
      } else { // si no, quitalo de la lista de invisibles
        paciente.classList.remove("invisible");  
      }
    }
  } else { // si el usuario no introdujo texto:
    for (var i = 0; i < pacientes.length; i++){
      var paciente = pacientes[i];
      paciente.classList.remove("invisible");
    }
  }
});
1 respuesta

Hola Roberto , espero que esté bien.

Gracias por compartir tu código con nosotros, contínua con tu estudos :)

Si tienes alguna pregunta sobre el contenido de los cursos, estaremos aquí para ayudarte.

Si este post te ayudó, por favor, marca como solucionado ✓. Continúa con tus estudios