Naughty Ninja Naughty Ninja - 5 months ago 14
HTML Question

Hide and Show number of rows in a table that are sharing the same ID

I'm generating rows dynamically, I've added an ID value to

<tr>
tag, therefore each generated row has got the same ID. The problem is when I try to hide and show these rows, it's only hiding and showing the first row, even though there are many more.

<tr style="color: lightgrey; display: none" id="deletedTrainingRecords">
<td>@d</td>
<td>@e.TrainingDate.ToShortDateString()</td>
<td>@e.DateAdded.ToShortDateString()</td>
<td>@e.AddedBy</td>

<td class="@cls[0]"></td>
<td>
<a class="fa fa-flag-o" style="cursor: default" title="Deleted Record"></a>
</td>
</tr>

Answer

use this code on your event that handle the show and hide

$(document).find("tr#deletedTrainingRecords").each(function(){
   //dosomething
})

if can, avoid using same id's explained in this post ,you can change the id into class. and change the above selectors from tr#deletedTraingRecords into tr.deletedTrainingRecords

$(document).find("tr.deletedTrainingRecords").each(function(){
   //dosomething
})
Comments