Pubblicato da Se in una pagina html hai un form con all'interno dei radio button, potresti voler controllare che almeno uno dei valori indicati a video, sia stato selezionato.
Per fortuna quindi, con il jascript è possibile controllare i radiobutton presenti nelle form, in modo tale da verificare che sia avvenuto almeno un check.
Come controllare se almeno un elemento di una radio button è stato selezionato tramite javascript
Ecco un semplice esempio da copincollare in una file da chiamare radio.html.
<html>
<head>
<title>Controllo Radio button Javascript</title>
<script type="text/javascript">
function controlla()
{
var almenouno=false;
for(i=0;i<document.theform.colori.length;i++)
{
if(document.theform.colori[i].checked)
{
almenouno=true;
break;
}
}
if(!almenouno)
{
alert("Attenzione, selezionare un colore");
return false;
}
}
</script>
</head>
<body>
<form method="post" action="radio.html" name="theform" onsubmit="return controlla();">
<input type="radio" name="colori" value="rosso" />Rosso<br />
<input type="radio" name="colori" value="verde" />Verde<br />
<input type="radio" name="colori" value="bianco" />Bianco<br />
<input type="submit" value="Invia">
</form>
</body>
</html>
Quello che fa questo script è molto semplice: cicla tutti gli elementi presenti in una lista di tipo radio button, e tramite la funzione checked ne verifica la selezione.
Se trova che un elemento è stato ceccato, allora esce subito dal ciclo for tramite l'istruzione break, altrimenti, se alla fine del giro non ha trovato alcun elemento selezionato, blocca l'invio del form con un bel return false.
Sapere usare il controllo javascript radio button è decisamente una cosa utile nel caso si utilizzino delle form html dove i radio non sono selezionati di default.
Piaciuto l'articolo? Lascia un commento!
EmoticonEmoticon