Foro de elhacker.net

Programación => Desarrollo Web => Mensaje iniciado por: 1mpuls0 en 15 Mayo 2012, 00:24 am



Título: Problema al crear columna dinamica con javascript
Publicado por: 1mpuls0 en 15 Mayo 2012, 00:24 am
Hola.
Necesito crear filas de manera dinamica para una tabla, hasta aqui no hay problema, puedo crear hasta n filas, el problema es que el alto de la pagina se va extendiendo, así que opte por crear una nueva columna pero aun no logro hacerlo, todo esto con javascript.

Aqui el código que tengo del script

Código
  1. <script language="javascript" type="text/javascript">
  2. var posicionCampo=1;
  3.  
  4. function agregarEquipo(){
  5. nuevaFila = document.getElementById("equipos").insertRow(-1);
  6.     nuevaFila.id=posicionCampo;
  7.  
  8.  
  9. if(esImpar(posicionCampo)){
  10. nuevaCelda=nuevaFila.insertCell(-1);
  11. nuevaCelda.innerHTML="<tr id='impar'><td><input type='text' size='30' maxlength='50' id='txtEquipo"+posicionCampo+"' name='txtEquipo"+posicionCampo+"' class='required' onBlur='valida(this)'></td>";
  12. nuevaCelda=nuevaFila.insertCell(-1);
  13. nuevaCelda.innerHTML="<td><a onclick='eliminarEquipo(this)'><font color='#FF3333'><u>Eliminar</u></font></a></td></tr>";
  14. }else{
  15. nuevaCelda=nuevaFila.insertCell(-1);
  16. nuevaCelda.innerHTML="<tr id='par'><td><input type='text' size='30' maxlength='50' id='txtEquipo"+posicionCampo+"' name='txtEquipo"+posicionCampo+"' class='required' onBlur='valida(this)'></td>";
  17. nuevaCelda=nuevaFila.insertCell(-1);
  18. nuevaCelda.innerHTML="<td><a onclick='eliminarEquipo(this)'><font color='#FF3333'><u>Eliminar</u></font></a></td></tr></tr>";
  19. }
  20. var total = document.getElementById( "txtTotal" );
  21. total.value = posicionCampo;
  22.  
  23. posicionCampo++;
  24.  
  25. }
  26. </script>
  27.  


Aquí como tengo inicialmente la estructura de la tabla.

Código
  1. <table id="equipos" border="0">
  2.    <tr id="impar"></tr>
  3.    <tr id="par"></tr>
  4.  </table>
  5.  

Alguien sabe como puedo solucionarlo?.

Gracias


Título: Re: Problema al crear columna dinamica con javascript
Publicado por: Neibar en 24 Mayo 2012, 20:30 pm
encontré ésto por internet, a ver si te sirve

Código
  1. <SCRIPT LANGUAGE="javascript">
  2. function agrega_fila(id){
  3.    var tbody = document.getElementById(id).getElementsByTagName("TBODY")[0];
  4.    var row = document.createElement("TR")
  5.    var td1 = document.createElement("TD")
  6.    td1.appendChild(document.createTextNode("columna 1"))
  7.    var td2 = document.createElement("TD")
  8.    td2.appendChild (document.createTextNode("columna 2"))
  9.    row.appendChild(td1);
  10.    row.appendChild(td2);
  11.    tbody.appendChild(row);
  12.  }
  13. </script>
  14. </HEAD>
  15. <BODY>
  16. <input type="button" value="Agregar Fila" onClick="agrega_fila('mi_tabla')">
  17. <!--a href="javascript:agrega_celda('mi_tabla')">Agrega nueva</a-->
  18. <table id="mi_tabla" cellspacing="0" border="1">
  19.  <tbody>
  20.    <tr>
  21.      <td>Celda1_columna1</td>
  22.      <td>Celda1_columna2</td>
  23.    </tr>
  24.  </tbody>
  25. </table>
  26. </body>  




Título: Re: Problema al crear columna dinamica con javascript
Publicado por: 1mpuls0 en 23 Junio 2012, 19:09 pm
Gracias.
Al final opté por hacerlo de otra forma, la verdad estuve revisando y no miré que ya habías propuesto una solución.


Saludos