Hola, que tal?
Hice un script para añadir y quitar text inputs para mi formulario. Funciona bien, pero tengo un problema. Cuando yo añado un text input y escribo en el y pongo para agregar otro, la informacion escrita en el text input se borra, no entiendo porque lo hace.
Alguien podria ayudarme a encontrar el problema??
Mi codigo:
Código HTML:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN"
"http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html>
<head>
<title>Crear input file</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<script type="text/javascript">
fields = 2;
function addInput() {
if (fields < 31) {
var nombre = "nombre" + fields;
var link = "link" + fields;
document.getElementById('text').innerHTML +=
"<table><tr><td>Nombre #"+fields+"</td><td><input type='text' name='"+nombre+"' /></td></tr><tr><td>Link #"+fields+"</td><td><input type='text' name='"+link+"' /></td></tr></table>";
document.getElementById('cantidad').innerHTML = "<input type='text' name='cantidad' value='"+fields+"'/>";
fields += 1;
} else {
document.getElementById('warning').innerHTML =
"Máximo 30.";
document.form.add.disabled = true;
}
}
function removeInput( el ) {
if (fields > 2) {
document.getElementById('warning').innerHTML = "";
var parent = document.getElementById('text');
parent.removeChild(el);
fields -= 1;
document.getElementById('cantidad').innerHTML = "<input type='text' name='cantidad' value='"+(fields-1)+"'/>";
}
}
</script>
</head>
<body>
<p><input type="button" onclick="addInput();" value="Agregar"/><input type="button" onclick='removeInput(getElementById("text").lastChild)' value="Quitar"/></p>
<div id="text">
<table><tr><td>Nombre #1</td><td><input type='text' name='nombre1' /></td></tr><tr><td>Link #1</td><td><input type='text' name='link1' /></td></tr></table>
</div>
<div id="warning"></div>
<div id="cantidad"><input type='text' name='cantidad' value="1"/></div>
</body>
</html> Espero me puedan ayudar!
Muchas gracias!