Tema: Crear y remover inputs
Ver Mensaje Individual
  #13 (permalink)  
Antiguo 09/12/2009, 00:53
Avatar de neodani
neodani
 
Fecha de Ingreso: marzo-2007
Mensajes: 1.811
Antigüedad: 17 años, 11 meses
Puntos: 20
Respuesta: Crear y remover inputs
Cita:
Iniciado por zerokilled Ver Mensaje
el elemento que usas para eliminar la fila tienes que agregarla al elemento clonado.
Código: 
var clon = elemento.cloneNode(true);
clon.appendChild(elemento_borrar);
luego tienes que arreglar la funcion borrar para que elimine la fila, no el boton como tal.
No lo consigo, misma situación aun cambiando las cosas...

Código html: 
Ver original
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
  2. <html> 
  3. <head>
  4. <title>Crear y remover inputs</title>
  5. <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
  6. <style>
  7. body, td, th, div, p {
  8. color:#000000;
  9. font-family:"Lucida Grande",Verdana,Arial,Helvetica,sans-serif;
  10. font-size:small;
  11. }
  12. input {
  13. margin:0.3em;
  14. }
  15. a.removelink {
  16. background:transparent url(delete.png) no-repeat scroll 4px 0;
  17. color:#999999;
  18. font-size:0.9em;
  19. padding:1px 0 1px 24px;
  20. text-decoration:none;
  21. }
  22. a.addlink {
  23. background:transparent url(add.png) no-repeat scroll left top;
  24. color:#999999;
  25. font-size:0.9em;
  26. padding:1px 0 1px 20px;
  27. text-decoration:none;
  28. cursor:pointer;
  29. }
  30. </style>
  31. <script type="text/javascript">
  32. <!--
  33. num=0;
  34. function crear(obj) {
  35.   num++;
  36.   fi = document.getElementById('productos'); 
  37.   contenedor = document.createElement('div'); 
  38.   contenedor.id = 'div'+num; 
  39.   fi.appendChild(contenedor); 
  40.  
  41.   // boton eliminar
  42.   ele = document.createElement('a'); 
  43.   ele.href = '#';
  44.   ele.name = 'div'+num;
  45.   ele.onclick = function () {borrar(this.name)}
  46.   ele.className = 'removelink';
  47.   ele.innerHTML = 'Eliminar';
  48.   fi.appendChild(ele);
  49.   
  50.   var container = document.getElementById('productos');
  51.   container.appendChild(container.firstChild.cloneNode(true));
  52.   
  53.   var clon = elemento.cloneNode(true);
  54.   clon.appendChild(ele);
  55. }
  56. function borrar(obj) {
  57.   fi = document.getElementById('productos'); 
  58.   fi.removeChild(document.parentNode); 
  59. }
  60. --> 
  61. </script>
  62.  
  63. </head>
  64. <body>
  65. <form method="post" action="#">
  66. <div><a title="Añadir otra fila" class="addlink" onclick="crear(this)">Añadir</a></div>
  67. <div id="productos"><p> 
  68. <input type="text" value="" size="5" name="cantidad"/>
  69. <input type="text" value="" size="30" name="descripcion"/>
  70. <input type="text" value="" size="5" name="precio"/>
  71. <input type="text" value="" size="5" name="total"/></p>
  72. <div>
  73. </form> 
  74. </body>
  75. </html>

Muchas gracias de antemano!