Entrar Ainda não tem acesso?
Solucionado (ver solução)
Solucionado
(ver solução)
6
respostas

Estou fazendo um filtro usando RegExp e não está funcionando para os novos cadastros.

Referente ao curso JavaScript: programando na linguagem da web, no capítulo Filtrando uma tabela e atividade Filtrando com expressão regular

por Jayro Estrela Soares
| 117.6k xp | 17 posts

Está dando o seguinte erro no tdNome.textContent: filtra.js:11 Uncaught TypeError: Cannot read property 'textContent' of null at HTMLInputElement. (filtra.js:11)

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

campoFiltro.addEventListener("input", function(){
    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;

            var expressao = new RegExp(this.value, "i"); //busca tudo que tem .paciente, o "i" quer dizer case Insensitive

            if(!expressao.test(nome)){
                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");
     }

     }
});
6 respostas
por Jeferson Natanael
| 192.9k xp | 98 posts
Analista de Sistema

Considerando o erro que esta dando tdNome em algum momento esta undefined e não tem a propriedade textContent então para não ocorrer esse erro você deve fazer isso:

if (tdNome){
   var nome = tdNome.textContent;

   var expressao = new RegExp(this.value, "i"); //busca tudo que tem .paciente, o "i" quer dizer case Insensitive

   if(!expressao.test(nome)){
      paciente.classList.add("invisivel");
   }else{
      paciente.classList.remove("invisivel");
   }
}
por Jeferson Natanael
| 192.9k xp | 98 posts
Analista de Sistema

espero ter ajudado. :)

por Jayro Estrela Soares
| 117.6k xp | 17 posts

Obrigado pela ajuda! Fiz a mudança indicada e realmente não deu mais o erro, mas ainda não filtra os novos cadastros fazendo com que eles fiquem ainda na tabela mesmo digitando um carácter que eles não possuem.

solução!
por Jeferson Natanael
| 192.9k xp | 98 posts
Analista de Sistema

Mais os novos itens possuem a class paciente? se não, quando você adicionar novo item você deve adicionar a class a ele.

por Jeferson Natanael
| 192.9k xp | 98 posts
Analista de Sistema

você conseguiu ver se os novos itens tem pacientes? :)

por Jayro Estrela Soares
| 117.6k xp | 17 posts

Muito obrigado pela ajuda, consegui sim! Eu não estava adicionando a class .info-nome à nova td criada quando adiciono o novo registro. Então quando o filtro passava pela nova td não conseguia achar o textContent dessa class.

Ajudou bastante! ; )

Essa foi a solução.

function criaTd(dado,classe){
    var td = document.createElement("td");
    td.classList.add("info-nome");
    td.textContent = dado;
    return td;
}