Dynamic Javascript and IE

[martyf]

I'm developing an editable list of rows in a table where each row contains a text field and a series of buttons (move up, move down and delete row). The purpose of the system is so that each row is in fact an order. This form will then be posted to the server as a PHP page (hence the file's extension - see below for attachment).

I've tried searching for this, but, well, I'm not entirely sure what the problem is - I know what it is not doing, but not sure why. So therefore not too sure what I should be searching for.

Adding a row is sweet - it creates a new row, with the buttons, and sets the IDs of new row - that part is cool.

The problem is when I move or delete a row. Now I may be making this harder than it needs to be, but here is the general process for moving or deleting a row:
1. move or delete the row in question
2. run a 'resetRows' function which renumbers the rows based on their position in the updated table
The reason for this is that the order of the rows is important - the first row is order 1, the second row is order 2, and so on.

But in IE6 and IE7, I'm getting some perculiar results. The screen works fine in Firefox, so I'm really puzzled here as the logic makes sense.

Here's a test case:
- Make 3 rows, with the values a, b and c respectively
- Move the 'a' row down one
- The 'resetRows' function loops over 'b', 'a' and 'c' - correct, this is the new order - everything (in the DOM tree) is sweet at this stage
- Move the 'a' row down once more
- The 'resetRows' function loops over 'b', 'c', and 'b' - it doesn't find 'a'. What should happen is 'b', 'c', 'a'.
That's just one case in IE where it happens. As I said, in Firefox, it runs with no problems.

Attached is a zip file containing a PHP file, a JS file and the three images required.

Does anyone have any suggestions or ideas, or even alternate ways to create what I'm after, or alternate workarounds?

Cheers,
Marty

[martyf]

Hmm, well after some playing around and rethinking things, I have found a solution, but not a solution to the above problem.

I was overthinking the problem, overcomplicating it. Rather than actually moving a row, I'm now moving the value of two rows. So therefore, no need to renumber rows (except when deleting a row - yet that seems to work, touch wood).

So, bottom line - I made it harder than it needs to be, but also a solution to this problem above would be nice to know too.

Cheers,
Marty

Edit: Well it partially works. Again, Firefox works perfectly, but IE is a little odd. Everything is sweet adding and moving rows around. But when you delete a row, and then add a new row, you cannot move the added row. So back to the same problem as above I guess - I'm not getting any Javascript errors in IE (6 or 7) this time around. Here's an example:
- Make 3 rows, a, b and c
- Swap b and c
- Delete b
- Add a new row, with 'd' as the text
- d cannot be moved up, and c (the last in the previous list) canot be moved down. But a and c are still swappable.
Really bizarre...