formulario mostrarlo mediante un campo tipo radio

thehack · #1 (**permalink**) 17/08/2011, 08:37

hola compañero de foros del web aca les vengo con alguna duda sobre ajax quisiera saber como mostrar un fomulario mediante un campo de tipo radio que al ser seleccionado x opcion muestre el formulario mediante un id

ejemplo

Código HTML:

Ver original<div class="buttons"><strong>Quien Presenta</strong></div>
<fieldset>
   
<label><input type="radio" value="1" name="presenta" class="radio" />MADRE</label> 
<label><input type="radio" value="2" name="presenta"  class="radio" />PADRE</label> 
<label><input type="radio" value="3" name="presenta" class="radio"/>OTRO</label> 
<div class="clearBoth"></div>
</div>
 
</div>
 
</fieldset>
 
<----aca demostrarme el formulario segun el campo elijan si fue el padre, madre  u otro -->

#2 (**permalink**) 17/08/2011, 22:50

Saludos amigo, mire este código que hice en bombas y me comenta si le sirvió

Código:

<html>
    <head>
        <script>
            window.onload = function(){
                var arr = new Array();
                arr = document.getElementsByName("presenta");
                for(i = 0; i < arr.length; i++){
                    var el = document.getElementsByName("presenta").item(i);
                    el.onclick = function(){
                        borrarForumarios();
                        switch(this.value){
                           case "1":
                                document.getElementById("form1").style.display = "";
                            break;
                        
                            case "2":
                                document.getElementById("form2").style.display = "";
                            break;
                        
                            case "3":
                                document.getElementById("form3").style.display = "";
                            break;
                        }
                    }
                }
            }
            
            function borrarForumarios(){
                var arr = new Array();
                arr = document.getElementsByTagName("form");
                for(i = 0; i < arr.length; i++){
                    arr[i].style.display = "none";
                }
            }
        </script>
    </head>
   
    <body>
        <div class="buttons"><strong>Quien Presenta</strong></div>
        <fieldset>
            <label><input type="radio" value="1" name="presenta" class="radio" />MADRE</label> 
            <label><input type="radio" value="2" name="presenta" class="radio" />PADRE</label> 
            <label><input type="radio" value="3" name="presenta" class="radio"/>OTRO</label> 
        </fieldset>
        <form id="form1" style="display:none">
            <label>Boton Form 1</label><input type="text" id="campo1">
            <input type="submit" value="Formulario 1">
        </form>
        <form id="form2" style="display:none">
            <label>Boton Form 2</label><input type="text" id="campo2">
            <input type="submit" value="Formulario 2">
        </form>
        <form id="form3" style="display:none">
            <label>Boton Form 3</label><input type="text" id="campo3">
            <input type="submit" value="Formulario 3">
        </form>
    </body>
</html>