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

os novos paciente adicionas não estão sendo filtrados

quando eu insiro novos pacientes eles sempre ficam aparecendo, mesmo eu filtrando nomes que não tem nenhuma letra deles! no console eu recebo a seguinte msg: TypeError: tdNome is null

5 respostas

André, tudo certo? =)

Você poderia postar seu código aqui para podermos dar uma olhada, por favor? =)

Fábio

na hora!!! :D


//seleciona o que foi digitado na label
var campoFiltro = document.querySelector("#filtrar-tabela");

//seleciona todos os pacientes para a uma nova variável
campoFiltro.addEventListener("input",function(){
  console.log(this.value);
  var pacientes = document.querySelectorAll(".paciente");

  // percorre oque foi digitado e compara com os já cadastrados
  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;
      //uso da expressão regular
      var expressao = new RegExp(this.value, "i");

      // condição de teste da expressão, deixa o paciente invisível através da classe css
      if (expressao.test(nome)) {
        paciente.classList.remove("invisivel");

      }else{
          paciente.classList.add("invisivel");
          }
        }

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

Oi André,

Olha, como a filtragem dos pacientes é feita pelo nome deles, e o erro que você está recebendo é que o tdNome é nulo, desconfio que os pacientes que você esteja adicionando na tabela estão sem a classe info-nome.

Confere no código que adiciona um novo paciente na tabela, se ele está adicionando os pacientes com as classes certinho.

Para fazer isso, adicione um paciente pelo formulário e utilize o DevTools do Chrome para inspecionar o paciente adicionado e ver se ele tem todas as classes certinhas, mas principalmente pra ver se ele tem a classe info-nome em seu tdNome.

Caso ele não tenha alguma das classes, confere se as suas funções montaTd e a montaTr estão colocando as classes corretamente.

Depois de fazer esses checks, nos dá o retorno aqui para saber se resolveu. Caso não seja isso eu devo precisar dar uma olhada em seu código como um todo para garantir que não tenha nenhum erro, então hospeda ele no GitHub ou em um local aonde eu possa baixá-lo.

blz professor com sua dica eu achei onde estava o erro, exatamente na classe info-nome, na function motaTr estava como infor-nome em todas as classes provavelmente foi um ctrl c, ctrl v, e passou despercebido :D . vlew de mais agora o código está certinho!! abraços!!

tudo certo! :D

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