Solucionado (ver solução)
Solucionado
(ver solução)
2
respostas

Filtro da tabela não está funcionando

Bom dia Senhores poderiam me ajudar, creio que o problema estaja no if pois, até chegar lá a tabela estava funcionando.

Grato, Luiz

filtra.js

var campoFiltro = document.querySelector("#filtrar-tabela");

campoFiltro.addEventListener("input" , function(){
    console.log(this.value);
    var pacientes = document.querySelectorAll(".pacientes");

if ( this.value.length > 0 ) {

for(var i = 0; i < pacientes.length; i++) {
        var paciente = pacientes [i];
        var tdNome = paciente.querySelector(".info-nome");
        var nome = tdNome.textContent;
        if (nome != this.value) {

            paciente.classList.add("invisivel");

        } else {
            paciente.classList.remove("invisivel");
        }
    }    
}else {
    for (var i = 0; i < pacientes.length; i++) {
        var paciente = pacientes [i];
        paciente.classList.remove("invisivel");
    }
}

});

index.css

.fadeOut { opacity: 0; transition: 0.5s }

#filtrar-tabela { width: 200px; height: 35px; margin-bottom: 10px; }

.invisivel {

display: none;

}

`

2 respostas
solução!

Oi Luis

Quando estamos declarando a variável pacientes, a classe que a gente quer procurar é ".paciente" no seu código está ".pacientes"

Ficaria assim

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

Boa noite Felipe, Muito obrigado pela ajuda, agora está funcionando.

Abraço, Luiz

Quer mergulhar em tecnologia e aprendizagem?

Receba a newsletter que o nosso CEO escreve pessoalmente, com insights do mercado de trabalho, ciência e desenvolvimento de software