Capture table elements with jquery

Asked

Viewed 1,623 times

-4

How can I click elements of a table that is being dynamically filled with jQuery? I want when it clicked pain to be marked only 1 row of the table. I only managed to mark all.

Here when clicking on the table it shows a button and now I wanted to when to click on td it marks only the one that was clicked and not all

code:

$("#registros").click(function(){
  $("#excluir").toggle();
     $("tr").toggleClass("selected");
});
  • What is HTML? the element <table> has ID? which is the dynamic part? only the table content is dynamic or the table also?

  • table and dynamic content and table id in html and records

  • Join HTML to help you. You need to delegate this event, there are answers that look like what you need.

  • Managed to Resolve?

  • yes long ago

2 answers

0

I made an example running here, see if it helps you:

$("table td").on('click', function(e){
  var linha = $(this).parent();
  if($(linha).hasClass("marcado"))
  {
    $(linha).removeClass("marcado");
    $(linha).css('background', "");
  }
  else
  {
    $(linha).addClass("marcado");
    $(linha).css('background', "gray");
  }
  e.preventDefault();
});
table td{
  border: solid 1px #000;
  cursor: pointer;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table>
  <tr>
    <td>Coluna</td>
    <td>Coluna</td>
    <td>Coluna</td>
    <td>Coluna</td>
    <td>Coluna</td>
    <td>Coluna</td>
  </tr>
  <tr>
    <td>Coluna</td>
    <td>Coluna</td>
    <td>Coluna</td>
    <td>Coluna</td>
    <td>Coluna</td>
    <td>Coluna</td>
  </tr>  
  <tr>
    <td>Coluna</td>
    <td>Coluna</td>
    <td>Coluna</td>
    <td>Coluna</td>
    <td>Coluna</td>
    <td>Coluna</td>
  </tr>  
</table>

0

You need to use the . on of jquery (http://api.jquery.com/on/), passing from an element that already exists in the DOM as a reference, for example:

$('#elemento').on('click', '<identificador do elemento dinamico que será clicado', function(){
  // executa função
  });
<div id="elemento">
<!-- aqui vai ser inserido o conteudo dinamico -->
</div>

  • n it worked not I passed there in elemnto the id of my table there inside the identifier of the element I passed the tag <td> and put my function to mark the td c it was clicked but it did not rotate I put all the function you passed of click inside mine and was not no

  • but the reference cannot be the table if it is generated dynamically.... makes a test roughly puts the body as reference.... but you need to locate a wrapper closer to the element for reference

Browser other questions tagged

You are not signed in. Login or sign up in order to post.