Hi
I have a JavaScript function for swapping the values of rows in a table. I have a hidden field in each row to carry a record ID. As I switch the rows the function will update the hidden field but doesn't do it correctly if I switch a number of rows. I dynamically set the values to switch when the page loads but how can I change these values when the rows are moved.
The idea is to change the order of a recordset by clicking on an up or down arrow and then save the values on the record id and sort order, the two hidden fields in each row.
Any help would be appreciated
Thank you
Warren

function swapCells(idA,idB,id1,id2)
{
var cellA=document.getElementById('menu'+idA);
var cellB=document.getElementById('menu'+idB);
if(cellA&&cellB)
{
var temp1=cellA.innerHTML;
cellA.innerHTML=cellB.innerHTML;
cellB.innerHTML=temp1;
document.getElementById('menuid'+idA).value = id2;
document.getElementById('menuid'+idB).value = id1;
}
}

<tr>
<td id="menu1">
<input name="menuid1" type="hidden" id="menuid1" value="2" />

2 - 6 - Disability<br></td>
<td width="20" align="center">&nbsp;</td>
<td width="20" align="center"><img src="../../images/page/btn_down.png" value="down" onClick="swapCells(1,2,2,1);"></td>
<td width="60" align="center">1<input name="menuorder1" type="hidden" id="menuorder1" value="1" /></td>
</tr>
</tr>
<tr>
<tr>
<td id="menu2" width="300">
<input name="menuid2" type="hidden" id="menuid2" value="1" />

1 - 1 - Life<br></td>
<td width="20" align="center"><img src="../../images/page/btn_up.png" value="up" onClick="swapCells(2,1,1,2);"></td>
<td width="20" align="center"><img src="../../images/page/btn_down.png" value="down" onClick="swapCells(2,3,1,3);"></td>
<td width="60" align="center">2<input name="menuorder2" type="hidden" id="menuorder2" value="2" /></td>
</tr>
</tr>
<tr>
<tr>
<td id="menu3" width="300">
<input name="menuid3" type="hidden" id="menuid3" value="3" />

3 - 5 - Home and Auto<br></td>
<td width="20" align="center"><img src="../../images/page/btn_up.png" value="up" onClick="swapCells(3,2,3,1);"></td>
<td width="20" align="center"><img src="../../images/page/btn_down.png" value="down" onClick="swapCells(3,4,3,4);"></td>
<td width="60" align="center">3<input name="menuorder3" type="hidden" id="menuorder3" value="3" /></td>
</tr>

Member Avatar
fatihpiristine

...
var cellA=document.getElementById('menu'+idA);
var cellB=document.getElementById('menu'+idB);
...

check 'menu' + idA there seems wrong since u relaying on menuid1, menuid2

Hi Thanks

I finally figured it out so here is the change in case anyone else needs to do something like this:

function swapCells(idA,idB,id1,id2) 
{ 
  var cellA=document.getElementById('menu'+idA); 
  var cellB=document.getElementById('menu'+idB); 
  if(cellA&&cellB) 
  { 
    var temp1=cellA.innerHTML; 
    cellA.innerHTML=cellB.innerHTML; 
    cellB.innerHTML=temp1;
    var temp2=document.getElementById('menuid'+idA).value; 
    document.getElementById('menuid'+idA).value = document.getElementById('menuid'+idB).value;
    document.getElementById('menuid'+idB).value = temp2;
  } 
} 

Thank you