Bookmarklet elementId : reorder table rows

[nickknowledge]

We're going live with a new application at work on Monday. A form I'll be using many times a day would be more useful if the box for "type" was the first in the list.

There's a table (id = "artifactTable"), which I can query.

It's structured like:

<table id="artifactTable">
<tr valign="top" id="flexrow_3">
<td width="130">Developer:</td>
<td><select>Select info</select></td></tr>
</tr>
<tr valign="top" id="flexrow_7">
<td width="130">Type:</td>
<td><select>Select info</select></td></tr>
</tr>
</table>

What I'm trying to do is:
1. For each row in table "artifactTable"
2. Is <tr> id = "flexrow_7"?
3. If not, then move row to end, by using appendChild method.

The closest I've managed to come is by measuring the innerHTML length of all the rows:

(I'm using a bookmarklet in IE6):

javascript:function reorder(){var table=document.getElementById('artifactTable'); var rows=table.getElementsByTagName('tr'); for (i=0;i<rows.length;i++) {if (rows[i].innerHTML.length!= 358) {table.tBodies[0].appendChild(rows[i]);}; };} reorder();

This works, on the fifth attempt. There are maybe 15 rows, and once it's iterated through 1-4, it will stay constant with "Type" on top.

Any ideas / direction would be most appreciated.

Thanks,

Nick.

[Bernard Marx]

<updated - after seeing the wood through the trees>

- Simply finding the target row and moving it to the top is easier. This can be done using W3C standard methods, but since your only using IE, might as well use the convenient moveRow method.

Not that it's likely to matter, but you can avoid any possible namespace collision when using a bookmark by using a parenthesised anonymous function followed by parentheses...

The bookmark (tested in IE6):
(function(){document.getElementById('artifactTable').moveRow(document.getElementById('flexrow_7').rowIndex,0);})()

.. formatted for clarity:

(function()
{
  document.getElementById('artifactTable').moveRow(
    document.getElementById('flexrow_7').rowIndex,0
  );
})()

[Bernard Marx]

...but we don't need a function anyway.

void(document.getElementById('artifactTable').moveRow(document.getElementById('flexrow_7').rowIndex,0));

[nickknowledge]

Bernard,

Thanks for your help on this. Works perfectly in IE6.

Is .moveRow an IE6 only method? I tried it in Firefox, kept getting "not a method" errors. I'll mainly be accessing the page through IE6, so it's won't be an ongoing problem.

Thanks,

Nick.