Hello,

Here's what I did to allow users to reorder table rows on a recent form. The table in this example only has one field, but it wouldn't take much to modify this.

JavaScript

var upIcon = '🠉';
var downIcon = '🠋';

$(document).ready(function(){
  if(isIE()){
    upIcon = '˄';
    downIcon = '˅';
  }

  $('.questionTable tbody tr .col0 a').each(function(){
    questionButtons($(this));
  });
  
  eventHandlers();
});

function reorder(row, dest){
  var src = row.find(':input');
  var a = src.val();
  var b = dest.val();
  
  src.val(b).change();
  dest.val(a).change();
  
  if(src.val() != ''){
    src.blur();
  }
  
  if(dest.val() != ''){
    dest.blur();
  }
}

function questionButtons(target){
  // add up/down arrows for each row
  target.before('<div class="moveBtn"><div><span title="Move Up" class="moveUp">' + upIcon + '</span></div><div><span title="Move Down" class="moveDown">' + downIcon + '</span></div></div>');
}

function eventHandlers(){
  //  add up/down arrows for new row
  $('.questionTable .cf-table-add-row').on('click',function(){
    var target = $('.questionTable tbody tr:last-of-type .col0 a');
    questionButtons(target);
  });
  
  // move up event
  $('.questionTable').on('click','.moveUp',function(){
    var row = $(this).parents('tr');
    var prev = row.prev('tr').find(':input');
    
    reorder(row, prev);
  });
  
  // move down event
  $('.questionTable').on('click','.moveDown',function(){
    var row = $(this).parents('tr');
    var next = row.next('tr').find(':input');
    
    reorder(row, next);
  });
}

function isIE() {
    var ua = window.navigator.userAgent; //Check the userAgent property of the window.navigator object
    var msie = ua.indexOf('MSIE '); // IE 10 or older
    var trident = ua.indexOf('Trident/'); //IE 11

    return (msie > 0 || trident > 0);
}

I also included some CSS to position the buttons as well as ensure the up arrow is not visible on the first row and the down arrow is not visible on the last:

.moveBtn {
  float: right;
  margin-right: 4px;
}

.moveBtn > div {
  height: 18px;
}

.moveBtn > div > span {
  color: blue;
  cursor: pointer;
}

.questionTable tbody tr:first-of-type .moveUp,
.questionTable tbody tr:last-of-type .moveDown {
  visibility: hidden;
}