Hola, lo que hago es crear elementos con DOM, osea un formulario dinamico, con un boton que me agrega elementos y otro boton que elimina, y otro boton que elimina todos los que alla creado, pero no funcionan correctamente aqui les dejo el codigo:
Código HTML:
<html>
<head>
<style type="text/css">
p{
width:100px;
margin:0px;
display:inline;
padding:0px;
}
</style>
<script type="text/javascript">
var cantidad = 0;
function agregamos(){
cantidad++;
var elemento=document.createElement('p');
var texto=document.createTextNode('Opcion' + ' ' +cantidad+ ':');
elemento.appendChild(texto);
var obj=document.getElementById('opciones');
obj.appendChild(elemento);
var nuevohijo = document.createElement('input');
nuevohijo.type = 'text';
nuevohijo.name = 'opcion[]';
nuevohijo.id = 'nombre' + cantidad;
document.getElementById('opciones').appendChild(nuevohijo);
document.getElementById('opciones').appendChild(document.createElement('br'));
}
function eliminarultimo()
{
var puntero=document.getElementById("opciones");
if (puntero.childNodes.length>0)
puntero.removeChild(puntero.childNodes[0]);
puntero.removeChild(puntero.childNodes[0]);
}
function eliminartotal()
{
var i;
var j;
var puntero=document.getElementById("opciones");
var espacioabajo=puntero.getElementsByTagName("br");
for(i=0;i<puntero.childNodes.length;i++)
{
for(j=0;j<espacioabajo.length;j++)
{
puntero.removeChild(puntero.childNodes[j]);
}
puntero.removeChild(puntero.childNodes[i]);
puntero.removeChild(puntero.childNodes[i]);
}
cantidad = 0;
}
</script>
</head>
<body>
<h1 title="vamosarriba">Agregue elementos para la encuesta </h1>
<form action="encuesta_final.php" method="post" id="fs">
<input type="button" onclick="agregamos()" value="+">
<input type="button" onclick="eliminarultimo()" value="-">->
<input type="button" onclick="eliminartotal()" value="all">
</form>
<form action="#" method="post">
Titulo de la encuesta: <input type="text" name="titulo">
<div id="opciones"></div>
<input type="submit" value="Enviar" name="enviar">
<input type="reset" value="Borrar" name="reset">
</form>
</body>
</html>