[SOLVED] Problems Navigating the DOM on a Table

[kael.shipman]

Hey everyone,

 

I wrote a simple function to switch two table rows so that the one that was clicked moves either up or down in the table. For some reason, the function just won't do anything:

 

function moveAnnouncement(dir,annID) {
var curAnn, sibAnn, prnt, curIndx, sibIndx;
curAnn = document.getElementById('annRow'+annID); //Get the row that was clicked
prnt = curAnn.parentNode; //Get the enclosing table object
for(a = 0; a < prnt.childNodes.length; a++) { //find the index in the childNodes collection (is there a cleaner way to do this, like curAnn.childIndex or something?)
  if (prnt.childNodes[a] === curAnn) {
   curIndx = a;
   break;
  }
}
sibIndx = curIndx*1 + dir*1; //Use the passed dir variable (either 1 or -1) to find the index of the sibling that we're dealing with
if (sibIndx < 0 || prnt.childNodes[sibIndx] == undefined) return; //return if we've hit the limit

sibAnn = prnt.childNodes[sibIndx]; //load the sibling object into a variable
prnt.childNodes[sibIndx] = curAnn; //overwrite the sibling object with the object in question
prnt.childNodes[curIndx] = sibAnn; //rewrite the sibling object where the other object used to be.
}

 

I'm pretty sure the problem here is that objects in JavaScript are passed by reference, so I'm setting sibAnn to point to the object at sibIndx, then I set the variable at sibIndx to point to the current object, then I set the variable at curIndx to point to sibAnn, which is really confusing now that I draw it all out. Maybe that's not what's going on. Any ideas?

 

And while we're on it, is there a way to get JavaScript to copy an object rather than point to it, or, conversely, to point to a primitive variable rather than copy it?

 

Thanks in advance,

Kael

[kael.shipman]

Alright, I got it working, but I'd still like to find out why it didn't work before. Here's my solution:

 

function moveAnnouncement(dir,pID,annID) {
var curAnn, sibAnn, prnt, curIndx, sibIndx;
curAnn = document.getElementById('annRow'+annID);
prnt = curAnn.parentNode;
for(a = 0; a < prnt.childNodes.length; a++) {
  if (prnt.childNodes[a] === curAnn) {
   curIndx = a;
   break;
  }
}
sibIndx = curIndx*1 + dir*1;
if (sibIndx < 0 || prnt.childNodes[sibIndx] == undefined) return;

sibAnn = prnt.childNodes[sibIndx];
if (sibIndx < curIndx) {
  prnt.removeChild(curAnn);
  prnt.insertBefore(curAnn,sibAnn);
} else {
  prnt.removeChild(sibAnn);
  prnt.insertBefore(sibAnn,curAnn);
}
pageLib.orderAnns();
}

 

So the remaining questions here are the following:

 

Is there a good way to find the index of the child element in the childNodes array without looping through it and comparing?

Is there a way to force JS to pass a reference or to pass a copy to a variable (comparable to the & prefix in PHP)?