problema con creacion de tabla
Publicado por Juan Lopez (1 intervención) el 12/04/2010 17:32:26
hola... estoy tratanode hacer un codigo, el cual me permita agregar filas a una tabla al dar click en un boton, he vito varios ejemoloes en internet y me he guiado de ellos... sin embargo se me presento un problema al querer agregar el atributo rowspan....
trabajo con php tamb... peor la funcion de addfilas es con javascirpt voy a poner el codigo...
tengo esta tabla inicial... "en unarchivo php" ....
<table width=\"939\" border=\"1\" id=\"tabla\">
<tr bgcolor=\"#99CC66\">
<td scope=\"row\"><div align=\"center\"><strong>1</strong></div></td>
<td><div align=\"center\"><strong>2</strong></div></td>
<td><div align=\"center\"><strong>3</strong></div></td>
<td><div align=\"center\"><strong>4</strong></div></td>
<td><div align=\"center\"><strong>5</strong></div></td>
<td><div align=\"center\"><strong>6</strong></div></td>
<td><div align=\"center\"><strong>7</strong></div></td>
<td><div align=\"center\"><strong>8</strong></div></td>
</tr>
<tr>
<th rowspan=\"3\" scope=\"row\"> </th>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr>
<th rowspan=\"3\" scope=\"row\"> </th>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
</tr>
</table>
no tiene nada en especial esta tabla.... aora tengo dos btones
<tr> <div align=\"center\">
<td colspan=\"4\"><input type=\"button\" value=\"Agregar\" onclick=\"agregar()\"></td>
<td colspan=\"4\"><input type=\"button\" value=\"Borrar ultima\" onclick=\"borrarUltima()\"></td></div>
</tr>
estos llaman a la funcion q les comento de garegar una fila... la ual es:
"aqui si lo q tnego en javascript"
function agregar() {
var tr, td, tabla;
tabla = document.getElementById('tabla');
tr = tabla.insertRow(tabla.rows.length);
td = tr.insertCell(tr.cells.length);
td.style.border='solid 1px black';
td.style.background='red';
td.style.rowspan='3';
td.setAttribute("rowspan", "3");
td.setAttribute("", "3");
td.innerHTML = "<input type='text' id='t" + contLin + "1' value='t" + contLin + "1'>";
td = tr.insertCell(tr.cells.length);
td.innerHTML = "<input type='text' id='t" + contLin + "1' value='t" + contLin + "2'>";
td = tr.insertCell(tr.cells.length);
td.innerHTML = "<input type='text' id='t" + contLin + "2' value='t" + contLin + "3'>";
td = tr.insertCell(tr.cells.length);
td.innerHTML = "<input type='text' id='t" + contLin + "2' value='t" + contLin + "4'>";
td = tr.insertCell(tr.cells.length);
td.innerHTML = "<input type='text' id='t" + contLin + "2' value='t" + contLin + "5'>";
td = tr.insertCell(tr.cells.length);
td.innerHTML = "<input type='text' id='t" + contLin + "2' value='t" + contLin + "6'>";
td = tr.insertCell(tr.cells.length);
td.innerHTML = "<input type='text' id='t" + contLin + "2' value='t" + contLin + "7'>";
td = tr.insertCell(tr.cells.length);
td.innerHTML = "<input type='text' id='t" + contLin + "2' value='t" + contLin + "8'>";
tr = tabla.insertRow(tabla.rows.length);
td = tr.insertCell(tr.cells.length);
td.style.border='solid 1px black';
td.style.background='red';
td.innerHTML = "<input type='text' id='t" + contLin + "1' value='t" + contLin + "1'>";
td = tr.insertCell(tr.cells.length);
td.innerHTML = "<input type='text' id='t" + contLin + "1' value='t" + contLin + "2'>";
td = tr.insertCell(tr.cells.length);
td.innerHTML = "<input type='text' id='t" + contLin + "2' value='t" + contLin + "3'>";
td = tr.insertCell(tr.cells.length);
td.innerHTML = "<input type='text' id='t" + contLin + "2' value='t" + contLin + "4'>";
td = tr.insertCell(tr.cells.length);
td.innerHTML = "<input type='text' id='t" + contLin + "2' value='t" + contLin + "5'>";
td = tr.insertCell(tr.cells.length);
td.innerHTML = "<input type='text' id='t" + contLin + "2' value='t" + contLin + "6'>";
td = tr.insertCell(tr.cells.length);
td.innerHTML = "<input type='text' id='t" + contLin + "2' value='t" + contLin + "7'>";
tr = tabla.insertRow(tabla.rows.length);
td = tr.insertCell(tr.cells.length);
td.style.border='solid 1px black';
td.style.background='red';
td.innerHTML = "<input type='text' id='t" + contLin + "1' value='t" + contLin + "1'>";
td = tr.insertCell(tr.cells.length);
td.innerHTML = "<input type='text' id='t" + contLin + "1' value='t" + contLin + "2'>";
td = tr.insertCell(tr.cells.length);
td.innerHTML = "<input type='text' id='t" + contLin + "2' value='t" + contLin + "3'>";
td = tr.insertCell(tr.cells.length);
td.innerHTML = "<input type='text' id='t" + contLin + "2' value='t" + contLin + "4'>";
td = tr.insertCell(tr.cells.length);
td.innerHTML = "<input type='text' id='t" + contLin + "2' value='t" + contLin + "5'>";
td = tr.insertCell(tr.cells.length);
td.innerHTML = "<input type='text' id='t" + contLin + "2' value='t" + contLin + "6'>";
td = tr.insertCell(tr.cells.length);
td.innerHTML = "<input type='text' id='t" + contLin + "2' value='t" + contLin + "7'>";
contLin++;
}
para q unsa celda me ocupe 3 filas intente dos cosas..
td.style.rowspan='3';
td.setAttribute("rowspan", "3");
no me manda errores ni nada.... solo no funciona... alguien sabe porq?
trabajo con php tamb... peor la funcion de addfilas es con javascirpt voy a poner el codigo...
tengo esta tabla inicial... "en unarchivo php" ....
<table width=\"939\" border=\"1\" id=\"tabla\">
<tr bgcolor=\"#99CC66\">
<td scope=\"row\"><div align=\"center\"><strong>1</strong></div></td>
<td><div align=\"center\"><strong>2</strong></div></td>
<td><div align=\"center\"><strong>3</strong></div></td>
<td><div align=\"center\"><strong>4</strong></div></td>
<td><div align=\"center\"><strong>5</strong></div></td>
<td><div align=\"center\"><strong>6</strong></div></td>
<td><div align=\"center\"><strong>7</strong></div></td>
<td><div align=\"center\"><strong>8</strong></div></td>
</tr>
<tr>
<th rowspan=\"3\" scope=\"row\"> </th>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr>
<th rowspan=\"3\" scope=\"row\"> </th>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
</tr>
</table>
no tiene nada en especial esta tabla.... aora tengo dos btones
<tr> <div align=\"center\">
<td colspan=\"4\"><input type=\"button\" value=\"Agregar\" onclick=\"agregar()\"></td>
<td colspan=\"4\"><input type=\"button\" value=\"Borrar ultima\" onclick=\"borrarUltima()\"></td></div>
</tr>
estos llaman a la funcion q les comento de garegar una fila... la ual es:
"aqui si lo q tnego en javascript"
function agregar() {
var tr, td, tabla;
tabla = document.getElementById('tabla');
tr = tabla.insertRow(tabla.rows.length);
td = tr.insertCell(tr.cells.length);
td.style.border='solid 1px black';
td.style.background='red';
td.style.rowspan='3';
td.setAttribute("rowspan", "3");
td.setAttribute("", "3");
td.innerHTML = "<input type='text' id='t" + contLin + "1' value='t" + contLin + "1'>";
td = tr.insertCell(tr.cells.length);
td.innerHTML = "<input type='text' id='t" + contLin + "1' value='t" + contLin + "2'>";
td = tr.insertCell(tr.cells.length);
td.innerHTML = "<input type='text' id='t" + contLin + "2' value='t" + contLin + "3'>";
td = tr.insertCell(tr.cells.length);
td.innerHTML = "<input type='text' id='t" + contLin + "2' value='t" + contLin + "4'>";
td = tr.insertCell(tr.cells.length);
td.innerHTML = "<input type='text' id='t" + contLin + "2' value='t" + contLin + "5'>";
td = tr.insertCell(tr.cells.length);
td.innerHTML = "<input type='text' id='t" + contLin + "2' value='t" + contLin + "6'>";
td = tr.insertCell(tr.cells.length);
td.innerHTML = "<input type='text' id='t" + contLin + "2' value='t" + contLin + "7'>";
td = tr.insertCell(tr.cells.length);
td.innerHTML = "<input type='text' id='t" + contLin + "2' value='t" + contLin + "8'>";
tr = tabla.insertRow(tabla.rows.length);
td = tr.insertCell(tr.cells.length);
td.style.border='solid 1px black';
td.style.background='red';
td.innerHTML = "<input type='text' id='t" + contLin + "1' value='t" + contLin + "1'>";
td = tr.insertCell(tr.cells.length);
td.innerHTML = "<input type='text' id='t" + contLin + "1' value='t" + contLin + "2'>";
td = tr.insertCell(tr.cells.length);
td.innerHTML = "<input type='text' id='t" + contLin + "2' value='t" + contLin + "3'>";
td = tr.insertCell(tr.cells.length);
td.innerHTML = "<input type='text' id='t" + contLin + "2' value='t" + contLin + "4'>";
td = tr.insertCell(tr.cells.length);
td.innerHTML = "<input type='text' id='t" + contLin + "2' value='t" + contLin + "5'>";
td = tr.insertCell(tr.cells.length);
td.innerHTML = "<input type='text' id='t" + contLin + "2' value='t" + contLin + "6'>";
td = tr.insertCell(tr.cells.length);
td.innerHTML = "<input type='text' id='t" + contLin + "2' value='t" + contLin + "7'>";
tr = tabla.insertRow(tabla.rows.length);
td = tr.insertCell(tr.cells.length);
td.style.border='solid 1px black';
td.style.background='red';
td.innerHTML = "<input type='text' id='t" + contLin + "1' value='t" + contLin + "1'>";
td = tr.insertCell(tr.cells.length);
td.innerHTML = "<input type='text' id='t" + contLin + "1' value='t" + contLin + "2'>";
td = tr.insertCell(tr.cells.length);
td.innerHTML = "<input type='text' id='t" + contLin + "2' value='t" + contLin + "3'>";
td = tr.insertCell(tr.cells.length);
td.innerHTML = "<input type='text' id='t" + contLin + "2' value='t" + contLin + "4'>";
td = tr.insertCell(tr.cells.length);
td.innerHTML = "<input type='text' id='t" + contLin + "2' value='t" + contLin + "5'>";
td = tr.insertCell(tr.cells.length);
td.innerHTML = "<input type='text' id='t" + contLin + "2' value='t" + contLin + "6'>";
td = tr.insertCell(tr.cells.length);
td.innerHTML = "<input type='text' id='t" + contLin + "2' value='t" + contLin + "7'>";
contLin++;
}
para q unsa celda me ocupe 3 filas intente dos cosas..
td.style.rowspan='3';
td.setAttribute("rowspan", "3");
no me manda errores ni nada.... solo no funciona... alguien sabe porq?
Valora esta pregunta


0