O controle RadioButton e o controle RadioButtonList permitem que os usuários selecionem um pequeno conjunto de opções predefinidas mutuamente exclusivas.
1. Função
Você pode usar o controle CheckBox e o controle CheckBoxList para executar as seguintes operações:
· Causa um postback de página quando um botão de opção é selecionado.
·Capture a interação do usuário quando ele seleciona um botão de opção.
· Vincule cada botão de opção aos dados do banco de dados.
2. Antecedentes
Ao adicionar botões de opção a uma página da Web ASP.NET, você pode usar dois controles de servidor Web: um único controle RadioButton ou um controle RadioButtonList. Ambos os controles permitem ao usuário escolher entre um pequeno conjunto de opções predefinidas mutuamente exclusivas. Você pode usar esses controles para definir qualquer número de botões de opção rotulados e organizá-los horizontal ou verticalmente.
Você pode adicionar controles RadioButton individuais à página e usar os controles individualmente. Normalmente, dois ou mais botões separados são agrupados.
Como alternativa, você pode usar o controle RadioButtonList, que é um controle único que pode ser usado como controle pai para um grupo de itens da lista de botões de opção. Esse controle é derivado da classe base ListControl e, portanto, funciona de maneira muito semelhante aos controles de servidor Web ListBox, DropDownList, BulletedList e CheckBoxList. Muitos dos procedimentos para usar o controle RadioButtonList são iguais aos de outros controles de servidor Web de lista.
Ambos os tipos de controles têm suas próprias vantagens. Usar um único controle RadioButton oferece mais controle sobre o layout do grupo de botões de opção do que usar um controle RadioButtonList. Por exemplo, você pode incluir texto que não seja de botão de opção entre os botões de opção.
Se você deseja criar um conjunto de botões de opção com base nos dados de uma fonte de dados, o controle RadioButtonList é uma escolha melhor. Também é um pouco mais simples em termos de escrever código para verificar qual botão está selecionado.
Nota: Você também pode usar o controle de servidor HtmlInputRadioButton para adicionar botões de opção a páginas da Web ASP.NET.
Se você quiser fornecer ao usuário uma longa lista de opções ou uma lista que pode mudar de comprimento em tempo de execução, use o controle de servidor Web ListBox ou DropDownList.
1. Botões de opção de grupo
Os botões de opção raramente são usados sozinhos, mas são agrupados para fornecer um conjunto de opções mutuamente exclusivas. Dentro de um grupo, apenas um botão de opção pode ser selecionado por vez. Você pode criar botões de opção agrupados das seguintes maneiras:
Comece adicionando um único controle de servidor Web RadioButton à página e, em seguida, atribua manualmente todos os controles a um grupo. O nome do grupo pode ser qualquer um; todos os botões de opção com o mesmo nome de grupo são considerados parte de um único grupo.
Adicione um controle de servidor Web RadioButtonList à página. Os itens da lista neste controle são agrupados automaticamente.
2. Eventos RadioButton e RadioButtonList
Os eventos funcionam de maneira diferente entre um único controle RadioButton e um controle RadioButtonList.
3. Controle RadioButton único
Um único controle RadioButton gera o evento CheckedChanged quando o usuário clica no controle. (Esse evento é herdado do controle CheckBox.) Por padrão, esse evento não faz com que a página seja enviada ao servidor. No entanto, você pode forçar o controle a executar um postback imediatamente definindo a propriedade AutoPostBack como true.
Observação: o recurso de postback automático exige que o navegador suporte ECMAScript (Jscript ou JavaScript) e que o script esteja ativado no navegador do usuário.
Talvez seja necessário criar um manipulador de eventos para o evento CheckedChanged. Você pode testar qual botão de opção está selecionado em qualquer código executado como parte da página. Normalmente, você cria um manipulador de eventos para o evento CheckedChanged somente quando precisa saber que um botão de opção foi alterado, em vez de apenas ler a seleção atual.
4. Controle RadioButtonList
O controle RadioButtonList gera o evento SelectedIndexChanged quando o usuário altera o botão de opção selecionado na lista. Por padrão, esse evento não faz com que a página seja enviada ao servidor. No entanto, você pode forçar o controle a executar um postback imediatamente definindo a propriedade AutoPostBack como true.
Observação: o recurso de postback automático exige que o navegador suporte ECMAScript (Jscript ou JavaScript) e que o script esteja ativado no navegador do usuário.
Assim como acontece com controles RadioButton individuais, é mais comum testar o estado de um controle RadioButtonList depois que a página foi enviada por outros meios.
5. Atributos HTML de controle RadioButton
Quando o controle RadioButton for renderizado para o navegador, ele será dividido em duas partes: um elemento input representando o botão de opção e um elemento label separado representando o título do botão de opção. Esses dois elementos são combinados em um elemento span.
Quando você aplica estilos ou configurações de propriedade a um controle RadioButton, esses estilos e propriedades são aplicados ao elemento span externo. Por exemplo, se você definir a propriedade BackColor de um controle, a configuração será aplicada ao elemento span. Portanto, isso afetará os elementos de entrada internos e de rótulo.
Às vezes, pode ser necessário definir configurações separadas para botões de opção e rótulos. O controle RadioButton oferece suporte a duas propriedades que podem ser definidas em tempo de execução. O atributo InputAttributes permite adicionar atributos HTML ao elemento de entrada, e o atributo LabelAttributes permite adicionar atributos HTML ao elemento rótulo. As propriedades definidas são passadas para o navegador como estão. O exemplo a seguir mostra como definir as propriedades de um elemento de entrada para que, quando o usuário apontar o ponteiro do mouse sobre um botão de opção, apenas o botão de opção mude de cor e não o rótulo.
RadioButton1.InputAttributes.Add("onmouseover", "this.style.backgroundColor = 'vermelho'");
RadioButton1.InputAttributes.Add("onmouseout", "this.style.backgroundColor = 'branco'");
6. Vincule dados a controles
Você pode vincular um único controle RadioButton a uma fonte de dados e vincular qualquer propriedade de um controle RadioButton a qualquer campo da fonte de dados. Por exemplo, você pode definir a propriedade Text do controle com base nas informações do banco de dados.
Como os botões de opção são usados em grupos, vincular um único botão de opção a uma fonte de dados é incomum. Em vez disso, é mais comum vincular o controle RadioButtonList a uma fonte de dados. Nesse caso, a fonte de dados gera dinamicamente botões de opção (itens de lista) para cada registro na fonte de dados.
3. Como: Adicionar o controle de servidor Web RadioButton a uma página de Web Forms
Existem duas maneiras de adicionar botões de opção a uma página de Web Forms:
·Adicione um único controle de servidor Web RadioButton.
·Adicione um controle de servidor Web RadioButtonList e, em seguida, adicione um único item de lista ao controle.
Ao usar um único controle de servidor Web RadioButton, você normalmente adiciona um conjunto desses controles à página e os agrupa. Vários grupos de botões diferentes podem ser criados.
etapa:
1. Na guia "Padrão" da caixa de ferramentas, arraste o controle RadioButton para a página.
2. Na janela "Propriedades", especifique o título definindo a propriedade Texto.
3. Você também pode optar por alterar a direção do título definindo a propriedade TextAlign.
4. Repita as etapas 1 a 3 para cada botão de opção que deseja adicionar à página.
Agrupar controles individuais do servidor web RadioButton
Defina a propriedade GroupName de cada controle com o mesmo nome. Você pode usar qualquer string como nome, mas ela não pode conter espaços. Por exemplo, você pode atribuir a string "RadioButtonGroup1" à propriedade GroupName de todos os botões.
Para criar vários grupos de botões, use um nome de grupo diferente para cada grupo.
Nota: A qualquer momento, você pode adicionar controles RadioButton à página e dividi-los em grupos existentes.
4. Como: Adicionar o controle de servidor Web RadioButtonList a uma página de formulários da Web
Existem duas maneiras de adicionar botões de opção a uma página de Web Forms:
·Adicione um controle de servidor Web RadioButtonList e, em seguida, adicione um único item de lista ao controle.
·Adicione um único controle de servidor Web RadioButton.
Ao usar o controle RadioButtonList, você pode adicionar controles individuais à página. Adicionar itens a um controle é um processo separado, dependendo se você deseja exibir uma lista estática no controle ou uma lista gerada dinamicamente em tempo de execução.
etapa:
1. Na guia "Padrão" da caixa de ferramentas, arraste o controle RadioButtonList para a página.
2. Você também pode optar por alterar a direção do título definindo a propriedade TextAlign na janela “Propriedades”.
3. Você também pode optar por alterar o layout do controle para exibir várias colunas.
4. Siga um dos seguintes métodos para criar um item para o controle:
·Crie cada item separadamente.
· Vincular dados ao controle.
5. Como: Definir e obter a seleção no controle do servidor Web RadioButton
Você pode definir o botão de opção selecionado em tempo de design ou no código em tempo de execução. Se um botão de opção pertencer a um grupo, a configuração do botão limpará todas as outras seleções do grupo.
Nota: Se você estiver usando o controle RadioButtonList, o processo de obtenção e configuração do valor do botão será diferente.
1. Defina o controle RadioButton selecionado
Defina a propriedade Checked do controle como true. Se você selecionar vários controles RadioButton em um grupo, o navegador determinará qual botão será selecionado.
Se você definir esta propriedade como falsa, a seleção será desmarcada, mas outro botão de opção não será selecionado. Portanto, você pode limpar todas as seleções definindo a propriedade Checked de todos os botões de opção em um grupo como falsa.
Determinar qual controle RadioButton foi selecionado é essencialmente testar a propriedade Checked.
public void Button1_Click (remetente do objeto, System.EventArgs e)
{
if (RadioButton1.Checked) {
Label1.Text = "Você selecionou " + RadioButton1.Text;
}
senão if (RadioButton2.Checked) {
Label1.Text = "Você selecionou " + RadioButton2.Text;
}
senão if (RadioButton3.Checked) {
Label1.Text = "Você selecionou " + RadioButton3.Text;
}
}
6. Como: Definir o layout no controle do servidor Web RadioButtonList
Por padrão, o controle de servidor Web RadioButtonList exibe apenas uma lista de botões. No entanto, você pode especificar qualquer número de colunas e, dentro dessas colunas, também pode especificar como os itens são classificados: verticalmente (padrão) ou horizontalmente. Um layout vertical de três colunas é assim:
A D G
B E H
C F
Um layout horizontal dos mesmos itens produz o seguinte layout:
A B C
D E F
G H
Especifique a contagem e classificação de colunas
·Defina a propriedade RepeatColumns do controle RadioButtonList com o número de colunas desejado.
· Use a enumeração RepeatDirection para definir a propriedade RepeatDirection como Vertical ou Horizontal, conforme mostrado no exemplo de código a seguir.
protegido void Button1_Click (objeto remetente, System.EventArgs e)
{
// Cria cinco botões de opção.
string[] cores = {"Vermelho", "Azul", "Verde", "Amarelo", "Laranja"};
this.RadioButtonList1.Items.Clear();
for(int i=0;i < cores.GetLength(0);i++){
this.RadioButtonList1.Items.Add(cores[i]);
}
// Disponha os botões de opção horizontalmente.
this.RadioButtonList1.RepeatDirection =
RepetirDireção.Horizontal;
}
7. Como: Responder às seleções do usuário no grupo de controle do servidor Web RadioButton
Quando o usuário seleciona um controle RadioButton, o controle gera um evento ao qual você pode responder.
Descrição: os eventos gerados pelo controle RadioButtonList são diferentes dos eventos gerados por um único controle RadioButton.
Talvez você não precise responder diretamente ao evento de seleção do controle RadioButton. Responda a este evento somente se for necessário saber quando o usuário alterou a seleção no grupo de botões de opção.
Se você quiser apenas saber qual botão de opção foi selecionado e não quiser saber se a seleção foi alterada, basta testar a seleção do botão de opção depois que o formulário for enviado ao servidor.
Como cada controle de servidor RadioButton é um controle separado e cada controle pode gerar eventos de forma independente, o grupo de botões de opção não gera eventos como um todo;
Crie um manipulador de eventos para o evento CheckedChanged do controle.
Por padrão, o evento CheckedChanged não faz com que a página Web Forms seja enviada imediatamente ao servidor. Em vez disso, o evento será gerado no código do servidor na próxima vez que o formulário for enviado (como quando o controle de servidor Web Button é clicado). Para fazer com que o evento CheckedChanged cause postagem imediata, defina a propriedade AutoPostBack do controle RadioButton como true.
Nota: Para enviar o controle RadioButton ao servidor quando ele estiver selecionado, o navegador deve suportar ECMAScript (JScript, JavaScript) e o navegador do usuário deve habilitar scripts.
O exemplo de código a seguir demonstra como responder quando um usuário seleciona um controle RadioButton.
public void RadioButton1_CheckedChanged (remetente do objeto,
System.EventArgs e)
{
Label1.Text = "Você selecionou Radio Button " + RadioButton1.Text;