Cita:
Iniciado por zerokilled 
en rojo el codigo modificado. fijate lo que hace es simple: obtiene un clon de la fila, a ese clon le agrega el boton, y finalmente agrega el clon al elemento contenedor. en este caso asumo que lo agregarias al elemento contenedor porque de lo contrario no se que sentido tiene crear un DIV y agregarlo al DIV productos.
Código:
ele.className = 'removelink';
ele.innerHTML = 'Eliminar';
var clone = fi.firstChild.cloneNode(true);
clone.appendChild(ele);
contenedor.appendChild(clone);
}
en todo caso, todavia tienes trabajo que hacer. ahora te toca ajustar la funcion de eliminar la fila.
Tengo lo que me has dicho y he modificado el boton eliminar, ahora ya elimina correctamente. Pero salgo de una y caigo en otra.
¿Puede decirme porque sucede esto?
Nada más mostrar la página me aparece los 4 inputs y abajo el botón añadir (esto no está mal del todo, pero a diferencia del código del post (6 más abajo, donde consigo que funcione declarando cada input por separado)
Cuando pulso sobre Añadir, me los agrega debajo de este boton en lugar de arriba, por lo que queda raro raro, ademas la primera fila se queda sin botón "eliminar" :S:S:S
Si puedes ejecutar el código veras las paranoias que le dan...
Código javascript
:
Ver original<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html>
<head>
<title>Crear input file - http://www.telefonica.net/web2/blas-mar/crear.html</title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<style>
body, td, th, div, p {
color:#000000;
font-family:"Lucida Grande",Verdana,Arial,Helvetica,sans-serif;
font-size:small;
}
input {
margin:0.3em;
}
a.removelink {
background:transparent url(delete.png) no-repeat scroll 4px 0;
color:#999999;
font-size:0.9em;
padding:1px 0 1px 24px;
text-decoration:none;
}
a.addlink {
background:transparent url(add.png) no-repeat scroll left top;
color:#999999;
font-size:0.9em;
padding:1px 0 1px 20px;
text-decoration:none;
cursor:pointer;
}
</style>
<script type="text/javascript">
<!--
num=0;
function crear(obj) {
num++;
fi = document.getElementById('productos');
contenedor = document.createElement('div');
contenedor.id = 'div'+num;
fi.appendChild(contenedor);
// boton eliminar
ele = document.createElement('a');
ele.href = '#';
ele.name = 'div'+num;
ele.onclick = function () {borrar(this.name)}
ele.className = 'removelink';
ele.innerHTML = 'Eliminar';
var clone = fi.firstChild.cloneNode(true);
clone.appendChild(ele);
contenedor.appendChild(clone);
}
function borrar(obj) {
fi = document.getElementById('productos');
fi.removeChild(document.getElementById(obj));
}
-->
</script>
</head>
<body>
<form method="post" action="#">
<div id="productos"><p>
<input type="text" value="" size="5" name="cantidad"/>
<input type="text" value="" size="30" name="descripcion"/>
<input type="text" value="" size="5" name="precio"/>
<input type="text" value="" size="5" name="total"/>
</p>
<a title="Añadir otra fila" class="addlink" onclick="crear(this)">Añadir</a></div>
<div>
<div>
</form>
</body>
</html>
Muchas gracias de antemano!