Hola!!
Tengo un problema y llevo días dándolo vueltas y la verdad es que no consigo solucionarlo, así que agradecería vuestra ayuda.
Mi problema es que estoy intentando crear filas dinámicamente al pulsar un botón y me lo crea, el problema es que quiero que me las cree con un colspan determinado y no sé como hacerlo
Adjunto mi código, espero respuesta.
<html>
<head>
<link rel="stylesheet" type="text/css" href="../styles/pro_fichas.css">
<style type="text/css">
.imagen1{
position:absolute;
right:80px;
top:158px;
}
.imagen2{
position:absolute;
right:60px;
top:158px;
}
</style>
<script language="javascript">
var numero = 0;
function añadir1()
{
// obtenemos acceso a la tabla por su ID
var TABLE = document.getElementById("tabla");
// obtenemos acceso a la fila maestra por su ID
var TROW = document.getElementById("fila1");
// tomamos la celda
var content1 = TROW.getElementsByTagName("c1");
var content2 = TROW.getElementsByTagName("c2");
// creamos una nueva fila
var newRow = TABLE.insertRow(7);
newRow.className = TROW.attributes['class'].value;
// creamos una nueva celda
var newCellcuenca = newRow.insertCell(newRow.cells.length)
var newCellsubcuenca = newRow.insertCell(newRow.cells.length)
// creamos una nueva ID para el examinador
newIDcuenca = 'cuenca_' + (++numero);
newIDsubcuenca = 'subcuenca_' + (++numero);
// creamos un nuevo control
txtcuenca = '<input type="text" id="' + newIDcuenca + '" size="15" value="nombre cuenca" class=nobord />'
txtsubcuenca = '<input type="text" id="' + newIDsubcuenca + '" size="15" value="nmbre subcuenca" class=nobord />'
// y lo asignamos a la celda
newCellcuenca.innerHTML = txtcuenca
newCellsubcuenca.innerHTML = txtsubcuenca
}
function borrar1()
{
// obtenemos la tabla
var TABLE = document.getElementById("tabla");
// si tenemos mas de una fila, borramos
if(TABLE.rows.length> 10)
{
TABLE.deleteRow(TABLE.rows.length-4);
--numero;
}
}
</script>
</head>
<body>
<table border = '1' width=90% id="tabla">
<tr><td colspan=10 class=color_marino>MEDIO FÍSICO </td></tr>
<tr><td colspan=2 class=negrita>Municipio</td>
<td colspan=10 class=negrita><input class=nobord type=text size=30
value='nombre del municipio' /></td></tr>
<tr><td colspan=10 class=color_azul>AGUA</td></tr>
<tr><td colspan=10 class=color_rosa>HIDROGRAFÍA</td></tr>
<tr><td colspan=10 class=color_gris>CUENCAS HIDROGRÁFICAS</td></tr>
<tr><td colspan=4 class=negrita>Cuencas Hidrográficas</td><td colspan=6 class=negrita>Subcuenca/as Hidrográficas
</td></tr>
<tr id="fila1">
<td colspan=4 id="c1"><input class=nobord type=text size=15 value='nombre cuenca' id="cuenca_0" /></td>
<td colspan=6 class=cursiva id="c2"><input class=nobord type=text size=15 value='nmbre subcuenca' id="subcuenca_0" /></td>
</tr>
<tr><td colspan=10 class=color_gris>INVENTARIO DE CURSOS FLUVIALES O AGUAS CORRIENTES: RÍOS Y ARROYOS</td></tr>
<tr><td colspan=2 class=negrita>Nombre</td><td colspan=4 class=negrita>Tipo</td><td colspan=4 class=negrita>
Longitud dentro del T.M. (Km.)</td></tr>
<tr><td colspan=2><input class=nobord type=text size=25 value='nombre' /></td><td colspan=4><input class=nobord type=text size=25 value='tipo' />
</td><td colspan=4><input class=nobord type=text size=25 value='longitud' /></td></tr>
<img src="-gris.jpg" alt="" class="imagen1" onClick="borrar1(event)" />
<img src="+gris.jpg" alt="" class="imagen2" onClick="añadir1(event)" />
</table>
</body>
</html>
GRACIAS