Swapping html table elements (the complete object) in javascript

Question

EDIT: I just noticed that I'm trying to swap integers because I'm getting the rowIndex. That's not what I want to do. I want to swap objects. However, I don't really know how.

I want to move table elements up and down in a queue by swapping with the element above and the element below respectively. However, my code doesn't work. The following is the JS function for the downButton.

var downButton = document.getElementsByClassName('downButton')[0];
downButton.onclick = function moveDown(currentRow) {
  var index = currentRow.parentNode.parentNode.rowIndex;
  var nextRow = currentRow.nextElementSibling.parentNode.parentNode.rowIndex;
  var temp = index;
  index = nextRow;
  nextRow = temp;
}

This is the html for the down button:

<button class = "downButton">down</button>

Here's a JSFiddle link for the table: https://jsfiddle.net/Led4b3nw/

Add the HTML for table also. And it would be better if you could add a working snippet or a jsFiddle — n4m31ess_c0d3r
– n4m31ess_c0d3r, Commented Nov 3, 2016 at 11:10

user6269864 · Accepted Answer · 2016-11-03 11:09:40Z

0

Swap innerHTML instead of indexes:

  var index = currentRow.parentNode.parentNode;
  var nextRow = currentRow.nextElementSibling.parentNode.parentNode;
  var temp = index.innerHTML;
  index.innerHTML = nextRow.innerHTML;
  nextRow.innerHTML = temp;

answered Nov 3, 2016 at 11:09

user6269864

Sign up to request clarification or add additional context in comments.

2 Comments

franklinsing Over a year ago

It gives me the following error: read property 'parentNode' of undefined at HTMLButtonElement.moveDown, I'm assuming because of removing rowIndex property.

user6269864 Over a year ago

This cannot be debugged without your full code then. It seems your currentRow is undefined. Did you forget to pass the value to the function?

Collectives™ on Stack Overflow

Swapping html table elements (the complete object) in javascript

1 Answer 1

2 Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

2 Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related