Jump to content
kernmatheus

Function que percorre table e recebe valor de <td>

Recommended Posts

Srs,

 

Tenho uma tabela alimentada a partir de um dataset.

Quando o usuário clica em alguma linha da tabela o <tr> recebe a class DANGER.

 

Eu preciso de uma função que identifique quais <tr> tem a class danger e me passe o valor das <td> de dentro desta <tr>.

 

Abaixo uma função que percorre a table e identifica a <tr> que está com a classe, porém dentro daquele IF eu preciso de algo que receba o valor das tags <td>.

Alguma sugestão?

 

function varre_table(){
				var trs = document.getElementsByTagName("tr");

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

					if (trs[i].className == "danger") {

						trs[i].className = "";


					}
				}
}

 

Share this post


Link to post
Share on other sites

Se você precisa apenas recuperar o valor das TDs, pode utilizar o código abaixo:

var trList = document.getElementsByTagName("tr");

for(var i = 0 ; i < trList.length ; i++)
{
    if (trList[i].classList.contains('danger'))
    {
        var tdList = trList[i].getElementsByTagName('td');
        for(var j = 0 ; j < tdList.length ; j++)
        {
            console.log(tdList[i].innerHTML);
        }
    }
}

Outro ponto, seria selecionar diretamente o conteúdo que possui a classe "danger"

 

https://jsfiddle.net/dbsas7sy/

  • +1 1

Share this post


Link to post
Share on other sites

ou:

 

var tdList = document.querySelectorAll('tr.danger td');

 

  • +1 3

Share this post


Link to post
Share on other sites
function varre_table(){
		var trs = document.getElementsByTagName("tr");
		var data = '';
		var preco = '';
			for (var i = 0; i<trs.length; i++) {

            	if (trs[i].className == "danger") {
						data = document.getElementsByTagName('td')[1].innerHTML;
						preco = document.getElementsByTagName('td')[3].innerHTML;
						genPDF();
				}
			}
	}

Obrigado pela ajuda,  finalizei pegando as informações desta maneira.

Share this post


Link to post
Share on other sites

@kernmatheus ambas as funções vão lhe suprir. Mas, acredito que a solução do @William Bruno seja a mais indicada (que eu desconhecia).

Share this post


Link to post
Share on other sites

Ahh não esquece de conferir:

http://caniuse.com/#search=querySelectorAll

 

 

As vezes a do Gabriel apesar de ser maior tem compatibilidade com um publico, da uma olhada no seu Target de Browser...(Tem Google Analytics)?

 

Share this post


Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now

  • Similar Content

    • By michael450
      Senhores, boa tarde.
       
      Estou com um probleminha... rss', preciso fazer a listagem de uma função da biblioteca "SPED-NFe"   na qual consulto quais as NFe que emitiram contra meu CNPJ, porém o ele executa toda a função e depois me trás o resultado, eu gostaria de trazer o resultado instantaneamente, como se fosse uma atualização segundo a segundo.
       
       
      Essas informações não são salvas em DB, é apenas para consulta.
      Se alguém puder ajudar serei muito grato,
       
      Abraço.
       
      Michael Douglas
    • By Lincoln Ferreira
      Eu estou tentando fazer um Jquery steps wizard mas não consigo colocar pra ele parar caso não tenha sido preenchido o formulario no segundo passo.
      http://www.jquery-steps.com/Examples
       
      if (newIndex === 2 && $("#Rua").val() == "") { return false; } $(document).ready(function() { $("#wizard").steps({ headerTag: "h2", bodyTag: "section", transitionEffect: "slideLeft", stepsOrientation: "vertical", labels: { current: "current step:", pagination: "Pagination", finish: "Finalizar", next: "Confirmar", previous: "Voltar", loading: "Carregando ..." }, onStepChanging: function(event, currentIndex, newIndex, cepError) { if (currentIndex > newIndex) { return true; } if (newIndex === 1) { return true; } if (newIndex === 2 && $("#Rua").val() == "") { return false; } } } ) }); <div id="wizard"> <h2>Verificação pedido</h2> <section> <h2><strong>Pedido:</strong></h2> <div class="lista-carrinho"></div> </section> <h2>Local de entrega</h2> <section> <div class="informações-usuario"> <form method="get" action="." id="#form-cep"> <div class="form-row"> <div class="form-group col-md-6"> <label for="cep">Cep:</label> <input name="cep" type="text" class="form-control" id="cep" placeholder="09572-660" value="" size="10" maxlength="9" required> </div> <div class="form-row"> <div class="form-group col-md-6"> <label for="rua">Rua:</label> <input name="rua" class="form-control" type="text" id="rua" placeholder="Sete de Dezembro" size="60" maxlength="" /> </div> </div> <div class="form-row"> <div class="form-group col-md-6"> <label for="bairro">Bairro:</label> <input name="bairro" class="form-control" type="text" placeholder="Nova Gerty" id="bairro" size="40" maxlength="40" /> </div> </div> <div class="form-row"> <div class="form-group col-md-6"> <label for="n">N°:</label> <input name="n" class="form-control" type="text" placeholder="2" id="n" size="6" maxlength="10" /> </div> </div> <div class="form-group col-md-6"> <label for="complemento">Complemento:</label> <input name="complemento" type="text" class="form-control" id="complemento" placeholder="Ao lado do extra" value="" size="10" maxlength="9" requerid> </div> <div class="form-row"> <div class="form-group col-md-11"> <label for="cidade">Cidade:</label> <input name="cidade" class="form-control" type="text" placeholder="São Bernardo do Carpo" id="cidade" size="40" maxlength="40" /> </div> </div> </div> </form> </div> </section> <h2>Forma de pagamento</h2> <section> <div class="row d-flex justify-content-center col-sm col-md col-lg m-5 "> <h2>Informe sua forma de pagamento :</h2> </div> <div class="row d-flex justify-content-center col-sm col-md col-lg m-5 "> <div class="col-2"> <li class="list-inline-item"> <div class="pure-radiobutton"> <input id="Dinheiro" name="dinheiro" type="radio" class="radio"> <label for="Dinheiro">Dinheiro</label> </div> </li> </div> <div class="row"> </div> <div class="col-2"> <li class="list-inline-item"> <div class="pure-radiobutton"> <input id="Cartao" name="cartao" type="radio" class="radio"> <label for="Cartao">Cartão</label> </div> </li> </div> </div> </section> </div>
    • By marcelocardoso
      Fala galera...
      Depois de tanto sofrer tentando e pesquisando na internet, não consegui resolver...
      A nível de conhecimento, segue código para:::

      1) Ao clicar, pegar o id do botão, em seguida abrir com slidetoggle e jogar no TOP tipo ancora.
      2) ou seja, expandir a slidetoggle, mas POSICIONAR no id da DIV, SECTION ou etc...

      CODE:
       
      $(function () { // $("#btn-maps").on("click", function () { // $('html, body').animate({ // scrollTop: $("#maps").slideToggle('slow').offset().top - 135 // }, 1200, 'linear'); // }); $("#btn-maps").click( function (event) { event.preventDefault(); if ($("#maps").is(":visible")) { $("#maps").slideUp(600).offset().top; } else { $("#maps").slideDown(600).offset().bottom; } } ); }); Este código, funciona perfeitamente, adaptado de vários códigos buscados na internet, porém, não consigo com nenhum dos dois, posicionar ao CLICK o SLIDETOGGLE ao expandir deixar examente no inicio do ID;

      Dicas, Sugestões como fazer, realizar, agradeço.
      Obrigado.

       
×

Important Information

Ao usar o fórum, você concorda com nossos Terms of Use.