Jump to content

FabioAraujo

Membros
  • Contagem de Conteúdo

    1
  • Ingressou

  • Última visita

Postagens postado por FabioAraujo

  1. Ola pessoal o codigo abaixo preenche uma tabela de 5 colunas com dados tipo texto, e tem os eventos a ser executado partindo do acionamento das teclas, se eu retirar <button id="acessar">ACESSAR</button>, a busca vai funcionar quando eu coloco novamente o que eu retiro para de funcionar, poderiam me ajudar, gostaria de colocar um botão pegando o conteúdo da quarta coluna e assim direcionar a uma rota site externo.

     

     

    //InicioPopular tabela

    for(var i=0 ;i < dados.length ; i++){

     

        var tr = `<tr><td>${dados[i][0]}</td><td>${dados[i][1]}</td><td>${dados[i][2]}</td><td>${dados[i][3]}</td><td><button id="acessar">ACESSAR</button></td></tr>`;

     

        tbody.innerHTML+=tr;//tbody recebe todos os elementos da tabela dos elementos contidos em <tr></tr>

    }

    //fim popular tabela

     

    document.getElementById("txtBusca").addEventListener("keyup",function(){

     

    var busca = document.getElementById("txtBusca").value.toLowerCase(); //obter o valor do campo de busca e joga todos os caracteres para Minuscula

     

          for(var i = 0; i < tbody.childNodes.length;i++){ //obter todos os nodes do tbady

     

            var achou = false;

     

             var tr = tbody.childNodes[i]; //acessa todos elementos tr

     

             var td = tr.childNodes;  //td recebe os itens encontrados.

     

                  for(var j = 0; j<td.length;j++){ //varre as 4 colunas das tabela verificando os valores contidos

                  Quando coloco outra tag dentro do td da erro nesta linha abaixo

                     let valor = td[j].childNodes[0].nodeValue.toLowerCase();/ /valor recebe todos os dados inseridos nas colunas e passa tudo para minuscula

                     

                     if(valor.indexOf(busca)!=0){ //verifica se o  que foi digitado no campo input se esta contido nas colunas,

                           achou = true;

                        }

                  }

                  if(achou){

                    tr.style.display = "table-row";

     

                  }else{

                    tr.style.display = "none";

               }

           }

    });

     

    index.html style.css

×
×
  • Create New...