hola como estan miren tengo este codigo su funcion es mover las filas de una tabla hacia ariba y abajo y dentro de ellas hay un div que en el que se puede escribir dentro dinamicamente el caso es que cuando escrivo y despues subo la celda no puedo modificar el contenido creo que por que cambia el valor del lid del <td id=>. la pregunta es si habria alguna manera de que esto no ocurriese o es imposible.
<html>
<head>
<title>
Tablas
</title>
<script type="text/javascript" src="MouseState.js"></script>
<script type="text/javascript" src="EditRegions.js"></script>
<script language=javaScript1.2>
function subir(x) {
var misFilas = document.getElementById("cuerpoTabla");
var soy = x.parentNode.parentNode; // etiqueta tr
var miSitio = soy.rowIndex;
if (miSitio == (misFilas.parentNode.rows.length - 1)) return;// última fila
if (miSitio == 0) { // cambiamos los colores de las flechas
misFilas.parentNode.rows[0].getElementsByTagName("b")[1].style.color = "blue";
misFilas.parentNode.rows[1].getElementsByTagName("b")[1].style.color = "#eeeeee";
}
if ((miSitio + 2) == (misFilas.parentNode.rows.length)) {
misFilas.parentNode.rows[miSitio + 1].getElementsByTagName("b")[0].style.color = "blue";
x.style.color = "#eeeeee";
}
var clon1 = soy.cloneNode(true);
var clon2 = misFilas.parentNode.rows[miSitio + 1].cloneNode(true);
misFilas.replaceChild(clon2, misFilas.rows[miSitio]);
misFilas.replaceChild(clon1, misFilas.rows[miSitio + 1]);
}
function bajar(x) {
var misFilas = document.getElementById("cuerpoTabla");
var soy = x.parentNode.parentNode; // etiqueta tr
var miSitio = soy.rowIndex;
if (miSitio == 0) return;// última fila
if (miSitio == 1) { // cambiamos los colores de las flechas
misFilas.parentNode.rows[0].getElementsByTagName("b")[1].style.color = "blue";
x.style.color = "#eeeeee";
}
if ((miSitio + 1) == (misFilas.parentNode.rows.length)) {
misFilas.parentNode.rows[miSitio].getElementsByTagName("b")[0].style.color = "blue";
misFilas.parentNode.rows[miSitio - 1].getElementsByTagName("b")[0].style.color = "#eeeeee";
}
var clon1 = soy.cloneNode(true);
var clon2 = misFilas.parentNode.rows[miSitio - 1].cloneNode(true);
misFilas.replaceChild(clon2, misFilas.rows[miSitio]);
misFilas.replaceChild(clon1, misFilas.rows[miSitio - 1]);
}
function cambiarDisplay(id) {
if (!document.getElementById) return false;
fila = document.getElementById(id);
if (fila.style.display != "none") {
fila.style.display = "none"; //ocultar fila
} else {
fila.style.display = ""; //mostrar fila
}
}
</script>
</head>
<body style="color:#000000" >
<div align="center">
<h1>
Ejemplo de Tabla
</h1>
<table id=unaTabla border=1
style="background-image: url(../colores/emoticon2.gif);
background-repeat: no-repeat;
background-position: center center;"
>
<tbody id="cuerpoTabla" >
<tr id="a1">
<td id="c1">
1<div class="editInPlace">slgamñrlgtjaelrx,guaqwetxqoeir tuisrnevtgsnltgnsegisl</div>
</td>
<td border="1">
<b onclick="subir(this)">↓</b>
<b style="color: #eeeeee" onclick="bajar(this)">↑</b>
</td>
</tr>
<tr id="a2">
<td id="c2">
2<div class="editInPlace">slgamñrlgtjaelrx,guaqwetxqoeir tuisrnevtgsnltgnsegisl</div>
</td>
<td border="1">
<b onclick="subir(this)">↓</b>
<b onclick="bajar(this)">↑</b>
</td>
</tr>
<tr id="a3">
<td id="c3">
3<div class="editInPlace">slgamñrlgtjaelrx,guaqwetxqoeir tuisrnevtgsnltgnsegisl</div>
</td>
<td border="1">
<b onclick="subir(this)">↓</b>
<b onclick="bajar(this)">↑</b>
</td>
</tr>
<tr id="a4">
<td id="c4">
4<div class="editInPlace">slgamñrlgtjaelrx,guaqwetxqoeir tuisrnevtgsnltgnsegisl</div>
</td>
<td border="1">
<b onclick="subir(this)">↓</b>
<b onclick="bajar(this)">↑</b>
</td>
</tr>
<tr id="a5">
<td id="c5">5<div class="editInPlace">fran</div><table border="1" id="row8" >
<tr id="row3" onClick="cambiarDisplay('a5')">
<td><strong> Televisores de LCD, Pantalla de Cristal Líquido</strong> (Stock: 90 unidades ) </td>
</tr>
<tr id="row4">
<td ><br><div class="editInPlace">slgamñrlgtjaelrx,guaqwetxqoeir tuisrnevtgsnltgnsegisl</div></td><td ><br><div class="editInPlace"><img src="Coloca aquielnombredetuimagen" alt="Texto alternativo"></div></td>
</tr>
</table>
<table id="row6" border="1" >
<tr id="row1" onClick="cambiarDisplay('row8')">
<td><strong> mostrar</strong> (Stock: 90 unidades ) </td>
</tr>
</table>
</td>
<td border="1">
<b style="color: #eeeeee" onclick="subir(this)">↓</b>
<b onclick="bajar(this)">↑</b>
</td>
</tr>
</table>
</div>
</body>
</html>