Radio button che attiva/disattiva textbox

**erialo** · 03-11-2014, 13:14

Ciao forum
sono alle primissime armi con php e javscript e html...
Ho bisogno di fare "una cosa" banalissima per voi ma non per me...
In una pagina php devo inserire due radiobutton, radio1 e radio.
Se seleziono radio1 vorrei che appaiano o che da disabilitati passino ad attivi le textbox NOME E COGNOME, se invece seleziono radio2 vorrei attivi o visibili tre texbox NOM, COGNOME e DENOMINAZIONE....
Come si fa?
Mi aiutereste per favore???

**JErikaM** · 03-11-2014, 13:30

Devi utilizzare JAVASCRIPT per questo.
Dando per scontato che hai già i tuoi radio button funzionanti (ovviamente in PHP), ti riporto il codice utilizzato da me per il sito che sto sviluppando. 3 radio button dove, cliccandone uno, si abilita un certo campo data di chiusura (che parte disabilitato da HTML).

Praticamente in base a chi è stato cliccato (button-radio-1 / -2 /-3 sono gli ID dei 3 radio button), si abilita il campo, nel mio caso EDITdatachiusura che è un input data (abilitato solo al click di radio-button-3).

Nel tuo caso puoi fare al posto di EDITdatachiusura, il nome del bottone che vuoi abilitare/disabilitare e ovviamente devi sostituire l'id dei vari radiobutton.

codice:

<script type="text/javascript"> //In base al click, abilito o disabilito la data di chiusura
    $(document).ready(function(){


    $('#button-radio-1').click(function(){
    $('input[name="EDITdatachiusura"]').attr('disabled','disabled');
    });


    $('#button-radio-2').click(function(){
    $('input[name="EDITdatachiusura"]').attr('disabled','disabled');
    });


    $('#button-radio-3').click(function(){
    $('input[name="EDITdatachiusura"]').removeAttr('disabled');
    });
});
</script>

spero possa aiutarti! fammi sapere

**carlomarx** · 03-11-2014, 14:18

Potrebbe non essere necessario scomodare JavaScript…:

codice:

<!doctype html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>Esempio</title>
<style type="text/css">
span.opt3 {
    display: none;
}

#opzione2:checked ~ span.opt2,
#opzione3:checked ~ span.opt3 {
    display: block;
}
</style>
</head>

<body>

<form action="test.php" metho="POST">
    <fieldset>
        <legend>Esempio</legend>
        <p>
            <input id="opzione1" type="radio" name="scelta" value="valore1" />
            <label for="opzione1">Opzione 1</label>
            <br />
            <input id="opzione2" type="radio" name="scelta" value="valore2" />
            <label for="opzione2">Opzione 2</label>
            <br />
            <input id="opzione3" type="radio" name="scelta" value="valore3" />
            <label for="opzione3">Opzione 3</label>
            <span class="opt2 opt3">Nome: <input type="text" name="nome" /></span>
            <span class="opt2 opt3">Cognome: <input type="text" name="cognome" /></span>
            <span class="opt3">Denominazione: <input type="text" name="denominazione" /></span>
        </p>
        <p>
            <input type="submit" value="Invia" />
        </p>
    </fieldset>
</form>

</body>
</html>

Discussione: Radio button che attiva/disattiva textbox

Strumenti discussione

Ricerca discussione

Visualizza

Radio button che attiva/disattiva textbox

Permessi di invio