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

Paciente fica invisível e não volta

Olá. Estou com o mesmo do nosso amigo Kaique, ou seja os pacientes somem todos e nenhum aparece conforme o meu input. Eu li a resolução da dúvida do Kaique e mesmo assim ainda não encontrei onde estou errando. Alguém poderia me ajudar com isso?

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

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

    for (var i = 0; i < pacientes.length; i++) {
        var paciente = pacientes[i];
        var tdNome = paciente.querySelector(".info-nome");
        var nome = tdNome.textContext;

        if (nome != this.value) {
            paciente.classList.add("invisivel");
        } else{
            paciente.classList.remove("invisivel");
        }
    }
});
4 respostas

Oi Salatiel,

Não achei nenhum erro no seu filtro então vamos para algumas perguntas para vermos se resolvemos o seu problema:

1) Acontece algum erro no seu console?

2) Qual o valor que aparece no this.value?

3) Se você mandar imprimir a variável nome, quais valores aparecem?

Abraço!

Ola Joviana. Muito obrigado. Respostas:

1) Não apresenta nenhum erro.

2) Os valores do this.value são cada letra que eu digito no input. Também tudo normal até aqui.

3)Porém aqui está o problema. Aparece "indefinido" no console.log da variável nome.

Mas ainda não sei como resolver.

solução!

No decorrer da aula o professor corrige isto:

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

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

    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");
        }
    }
});

Obrigado Cleverson.