how can i append a new tr to the top of the table instead of under other tr.
Example:
<table width='100%'>
<tr><td>something</td><td>else here</td></tr>
<tr><td>something2</td><td>else here2</td></tr>
</table>
After a click event in jQuery, how can i place
<tr><td>something3</td><td>else here3</td></tr>
at the top of the table so it now looks like
<table width='100%'>
<tr><td>something3</td><td>else here3</td></tr>
<tr><td>something</td><td>else here</td></tr>
<tr><td>something2</td><td>else here2</td></tr>
</table>
Any help on this would be greatly appreciated.
how can i append a new tr to the top of the table instead of under other tr.
Example:
<table width='100%'>
<tr><td>something</td><td>else here</td></tr>
<tr><td>something2</td><td>else here2</td></tr>
</table>
After a click event in jQuery, how can i place
<tr><td>something3</td><td>else here3</td></tr>
at the top of the table so it now looks like
<table width='100%'>
<tr><td>something3</td><td>else here3</td></tr>
<tr><td>something</td><td>else here</td></tr>
<tr><td>something2</td><td>else here2</td></tr>
</table>
Any help on this would be greatly appreciated.
Share Improve this question asked Mar 25, 2009 at 20:58 markmark2 Answers
Reset to default 8$('table').prepend('<tr><td>something3</td><td>else here3</td></tr>');
or...
$('<tr><td>something3</td><td>else here3</td></tr>').prependTo('table');
More info on 'prepend': http://docs.jquery./Manipulation/prepend
More info on 'prependTo': http://docs.jquery./Manipulation/prependTo
This JS is IE specific at the moment, but it shouldn't be too hard to make it multi-browser patible.
<html>
<body>
<script language="JavaScript">
function function1() {
var myRow = document.all.myTable.insertRow(0);
var myCell = myRow.insertCell();
myCell.innerText = "The added cell";
}
</script>
<table id="myTable" border="1" cellspacing="5" cellpadding="5">
<tr>
<td width="100">3</td>
<td width="100">4</td>
</tr>
<tr>
<td>1</td>
<td>2</td>
</tr>
</table>
<button onclick="function1();">Add a cell</button>
</body>
</html>