Adicione Botões de Radio aos Formulários HTML

Os Botões de Radio são controles circulares que servem para que o usuário possa escolher apenas uma opção entre duas ou mais. Eles são normalmente usados em Enquetes e Provas de Múltipla Escolha Online, etc.


Para criar um Botão de Rádio, também usamos a Tag <input>. No nosso caso, a Tag <input> deve ter seu atributo type preenchido com o valor radio e o parâmetro value deve ser definido obrigatoriamente já que o valor nele informado que será enviado pelo formulário.

Vamos a um exemplo:
<html>
<head>
<title>Qual o seu Time do Coração?</title>
</head>
<body>
<h1>Qual o seu Time do Coração?</h1>
<form method="post" action="cadastrar-enquete.php">
<input type="radio" name="time" value="bota" />
Botafogo
<br />
<input type="radio" name="time" value="fla" />
Flamengo
<br />
<input type="radio" name="time" value="flu" />
Fluminense
<br />
<input type="radio" name="time" value="vasco" />
Vasco da Gama
<br /><br />
<input type="submit" value="Enviar" />
<input type="reset" value="Cancelar" />
</form>
</body>
</html>
Repare que todos os Botões de Rádio estão com o parâmetro name definidos como time. Isso quer dizer que eles fazem parte do mesmo grupo e, com isso, ao clicar em uma opção, a outra é desmarcada automaticamente.

Já o parâmetro value serve para informar o que deve ser enviado ao servidor. Entenda que os rótulos não são enviados.

Observe o resultado:
Botões de Radio
Nota: Em breve publicarei um post que explica como o PHP recebe valores de Botões de Radio. Mais a frente, explicarei o mesmo em outras linguagens.

Dica: Se você quiser que alguma das opções já apareça marcada ao carregar a página, basta adicionar o atributo checked no Botão de Rádio desejado conforme abaixo:
<input type="radio" name="time" value="fla" checked />

Um comentário:

  1. Oi, explique-me 1 coisa, que ainda nao percebi.

    Eu ja decorei como fazer tudo isso.Mas depois eu mesmo que teste, ele nao vai dar, onde fica guardado tudo isso?no ficheiro "cadastrar-enquete.php"??so queria saber como colocar isso a funcionar, em qualquer site ou blog.

    ResponderExcluir

O que você achou do post? Faça um comentário.

Aprenda a receber dados de Formulário com PHP

Existem três arrays associativos que podemos usar para receber dados de Formulários HTML em PHP. São eles: $_GET , $_POST e $_REQUEST . O...