Update (ajax) only part of table without affecting whole table
- by ile
<table width="100%" border="0" cellspacing="0" cellpadding="0" class="list">
<tr>
<th><a href="#" class="sortby">Full Name</a></th>
<th><a href="#" class="sortby">City</a></th>
<th><a href="#" class="sortby">Country</a></th>
<th><a href="#" class="sortby">Status</a></th>
<th><a href="#" class="sortby">Education</a></th>
<th><a href="#" class="sortby">Tasks</a></th>
</tr>
<div class="dynamicData">
<tr>
<td>Firstname Lastname</a></td>
<td>Los Angeles</td>
<td>USA</td>
<td>Married</td>
<td>High School</td>
<td>4</td>
</tr>
</tr>
<tr>
<td>Firstname Lastname</a></td>
<td>Los Angeles</td>
<td>USA</td>
<td>Married</td>
<td>High School</td>
<td>4</td>
</tr>
</div>
</table>
The idea is to update table rows when clicking on link with clasl "sortby" which is part of th table tag.
I tried inserting div but this doesn't work. Separating this in two tables is not good solution because witdh in both tables cell are not following each other. Any other solution?
Thanks
