lunes, 28 de mayo de 2007

INPUTS dinámicos

Ahora con todo eso de las aplicaciones web enriquecidas, y que las interfaces web no deberian recargarse del todo cuando se hace un pequeño cambio, pues aquí pongo un script (en javascript, obviamente) que permite agregar y quitar INPUT-TEXT según sea el gusto.

<fieldset id="alternativas">
<legend>Alternativas</legend>
<input type="Text" id="alt1" name="alternativa" size="100"/><br/>
<input type="Text" id="alt2" name="alternativa" size="100"/>
</fieldset>
<input type="Button" value="Agregar alternativa" onclick="agregar_alternativa()"/>
<input type="submit" value="Guardar"/>
<script type="text/javascript">
function agregar_alternativa(){
var fieldset=document.getElementById("alternativas");
var inputs=document.getElementsByName("alternativa");

var br=document.createElement("br");
var newInput=document.createElement("input");
var grp=document.createElement("span");


newInput.name="alternativa";
newInput.size=100;
newInput.id="alt"+(inputs.length+1);


var btnRemove=document.createElement("input");
btnRemove.type="button";
btnRemove.value="Quitar";

grp.appendChild(br);
grp.appendChild(newInput);
grp.appendChild(btnRemove);
fieldset.appendChild(grp);
btnRemove.onclick=function(){var elem=this.parentNode;elem.parentNode.removeChild(elem);};

}
</script>