Find the last TR (group)

Question

Hi

i have the table below

<tr id="group_1>...</tr>
   <tr id="el">...</tr>
   <tr id="el">...<tr>
<tr id="group_2"></tr>
   <tr id="el">...</tr>
<tr id="group_1>...</tr>
   <tr id="el">...</tr>
   <tr id="el">...<tr>

I need to find the last TR of each group

$("tr#group_"+groupID).next("tr#el:last").after("ADD NEW TR");

Its not working for me!!

I guess thats because i use for all groups the same id.

Can anyone help me.

Thanks

Answer 1

You can't re-use IDs like that. Try changing it to classes instead.

It might also be worth putting some <tbody>s in there:

<tr id="group_1>...</tr>
<tbody id="group_1_tbody">
   <tr class="el">...</tr>
   <tr class="el">...<tr>
</tbody>
<tr id="group_2"></tr>
<tbody id="group_2_tbody">
   <tr class="el">...</tr>
</tbody>

Then you could do

$('group_' + groupID + '_tbody tr:last')

or even easier:

$('group_' + groupID + '_tbody').append('NEW TR')

Answer 2

Well firstly IDs must be unique so behaviour is going to be undefined in your above case.

Secondly, that's a difficult way to group rows. Try using TBODY elements instead>

<tbody id="group_2">
  <tr>...</tr>
  <tr>...<tr>
</tbody>
<tbody id="group_2">
  <tr>...</tr>
</tbody>
<tbody id="group_3">
  <tr>...</tr>
  <tr>...<tr>
</tbody>

and then things get much easier:

$("#group_" + groupNum + " tr:last-child").after("add new tr");

Thing is, you don't even need to do it this way (using after()). It's easier to do it using append():

$("#group_" + groupNum).append("add new tr");

Answer 3

ID's must be unique on a given page. You also don't need to specify the tag when you're identifying an element by ID, since IDs are unique.

A simpler form (once you get rid of those duplicate IDs) would be:

$("#group_"+groupID).children("tr:last").after("ADD NEW TR");