hi,
I'm trying to write some javascript code that will swap two rows in a
table, in an attempt to provide users with an easy and visual way to
manually change the order of the listed items in a table.
The sample code works as it should in IE, and switches the two rows
nicely.
In Mozilla however it fails the first time, but for some odd reason it
works fine afterwards.
Mozilla doesn't seem to be removing the duplicated node the first time,
which makes it appear as if an extra node is inserted into the table
(which is actualy the case), but on subsequent attempts, it seems to be
removing the duplicated node perfectly...
So why not the first time?
Any help would be appreciated.
regards,
J.
--- start code ---
<HTML>
<HEAD>
<SCRIPT LANGUAGE=javascript>
<!--
function switchRow() {
var table = document.getElementById("test")
var oRows = table.getElementsByTagName("TR");
var oTDs;
var numix;
var newTR = document.createElement("TR");
var NumRowA = 1;
var NumRowB = 2;
oTDs = oRows[NumRowB].getElementsByTagName("TD");
for (numix = 0; numix < oTDs.length; numix++) {
var newTD = document.createElement("TD");
newTD.innerHTML = oTDs[numix].innerHTML;
newTD.className = oTDs[numix].className;
newTR.insertBefore(newTD, null);
}
// using table object directly doesn't work on IE (o_O)
// but this indirect approach does the trick...
oRows[NumRowA].parentNode.insertBefore (newTR, oRows[NumRowA]);
// remove node
oRows[NumRowB].parentNode.removeChild(oRows[NumRowB].nextSibling,
true);
}
//-->
</SCRIPT>
</HEAD>
<BODY>
<button onclick="switchRow();">switch</button>
<table border="1" id="test">
<tr>
<td>one</td>
<td>nitron</td>
</tr>
<tr>
<td>two</td>
<td>soldiers</td>
</tr>
<tr>
<td>three</td>
<td>analysis</td>
</tr>
<tr>
<td>four</td>
<td>dark heart</td>
</tr>
</table>
</BODY>
</HTML>
--- end code
