Exemplos de código

1. Exemplos de código WebForm1.aspx: Caixa de Texto (TextBox) e Label (Label); Listas.aspx: Caixa de Listagem Simples (DropDownList), Caixa de Listagem Múltipla (ListBox); TestaMarcadores.aspx: Caixa de Checagem (CheckBox), Lista de caixas de checagem (CheckBoxList); TestaRadio.aspx: Botão de Rádio (RadioButton), Lista de botões de rádio (RadioButtonList). Tabela.aspx: Tabela HTML (Table); TesteExpressoesRegulares.aspx

2. Controle WebForm – TextBox Caixa de entrada de texto. Substitui o Input Text e o Text Area do HTML; Exemplo: <asp:TextBox id=“txtNome” AutopostBack=“false” Text=“Olá mundo” TextMode=“Single | Multiline | Password” OnTextChange=“OnTextChangeMethod” runat=“server”/> Propriedades importantes: ID: nome do objeto associado ao componente. TextMode: indica se o controle é do tipo texto (SingleLine - <input type=‘text’>), senha (Password - <input type=‘password’>) ou com múltiplas linhas (MultiLine - <textarea>). Text: o texto digitado no controle; AutoPostBack: boolean que indica se após a mudança do texto a validação será chamada automaticamente (recarrega a página!).

3. Controle WebForm – Button Fornece a funcionalidade de um botão. Ao contrário de HTML comum, não existe o conceito do botão submit. Cada botão recebe em código a sua funcionalidade. Propriedades importantes: ID: o nome do objeto associado ao controle. CausesValidation: indica se o botão invoca o procedimento de validação no servidor.

4. Controle WebForm – Label Elementos utilizados para indicar textos dinâmicos no HTML a partir de código C# externo; Semelhante ao div do HTML; Propriedades importantes: ID: nome do objeto associado ao componente. Text: o texto associado ao controle.

5. Projeto Exemplo Formulário Nome e Senha (WebForm1.aspx):

6. Projeto Exemplo Atenção! Siga os passos seguintes para recriar o Projeto Exemplo! Crie um projeto novo no Visual Studio (usaremos este projeto mais tarde, então guarde-o). Crie um novo WebForm ou utilize o que já está disponível no próprio projeto (WebForm1.aspx).

7. Projeto Exemplo Para utilizar o layout normal de HTML, primeiro clique na área do formulário. Em seguida, no menu Layout > Position, selecione o layout que preferir.

8. Projeto Exemplo Em seguida, digite os textos da página. Insira os TextBox nos lugares apropriados e mude as propriedades: O primeiro deve ser chamado de txtNome (ID). O segundo deve ser chamdo de txtSenha (ID). O segundo ainda deve ser selecionado com o estilo de senha.

9. Projeto Exemplo Insira os botões, chamando-os de enviar e limpa. Modifique os textos dos botões para indicar a sua funcionalidade. Insira os dois labels para indicar a saída. Dê a estes os nomes labelNome e labelSenha. Modifique os textos dos labels.

10. Projeto Exemplo Em seguida, crie os métodos associados aos botões: O botão Enviar deve processar os valores e colocá-los nos labels associados. O botão Limpar deve apagar os dados nos componentes digitáveis. Para criar cada método, basta clicar com o mouse duas vezes sobre o componente.

11. Projeto Exemplo Código para copiar os dados das entradas para os labels: labelNome.Text = "Nome digitado: " + txtNome.Text; labelSenha.Text = "Senha digitada: " + txtSenha.Text;

12. Projeto Exemplo Código para limpar os campos: txtNome.Text = ""; txtSenha.Text = ""; labelNome.Text = "Nome digitado: "; labelSenha.Text = "Senha digitada: ";

13. Controle WebForm – DropDownList Comando que oferece uma lista drop down. O usuário faz uma seleção de várias disponíveis. As opções ficam escondidas até o usuário selecionar o campo, tornando visíveis as opções para seleção.

14. Controle WebForm – DropDownList Propriedades importantes do DropDownList: ID: mesmo que nos outros controles. AutoPostBack: indica se o servidor é invocado automaticamente quando o elemento é modificado. Items: coleção de opções da lista. SelectedItem: o ítem selecionado. SelectedIndex: índice do elemento selecionado na lista.

15. Controle WebForm – DropDownList Ao adicionar um elemento, podemos ordená-lo em conjunto com os já presentes. Também podemos fornecer informações referentes ao elemento do DropDownList (ver Propriedade Items): Enabled: elemento habilitado ou não; Selected: indica se o elemento é marcado (true) ou não (false) por default. Text: o texto associado ao elemento. Value: o valor associado ao elemento.

16. Controle WebForm – DropDownList O controle permite a inclusão de itens em duas formas distintas: Estaticamente: via Visual Studio. Dinâmicamente: via código (utilizando o método Add).

17. Projeto Exemplo 2 Crie um novo formulário no seu projeto. Formate o projeto para utilizar o flow layout. Em seguida, adicione um controle DropDownList. Modifique o identificador para lista1.

18. Projeto Exemplo 2 Para adicionar opções na lista, basta selecioná-la e nas propriedades, ir em Items. Clique nos três pontos ao lado da propriedade.

19. Projeto Exemplo 2 Isto irá fornecer um diálogo para a inclusão de itens:

20. Projeto Exemplo 2 Insira na lista as opções “Carro”, “Ônibus” e “Motociceta”, associadas, aos valores “C”, “O” e “M”, respectivamente. Modifique a propriedade AutoPostBack para True.

21. Projeto Exemplo 2 Insira um label para indicar a opção selecionada, atribuindo a este o id labelSelecionado. Em seguida, clique duas vezes para criar o método que é invocado toda vez que o controle for modificado.

22. Projeto Exemplo 2 Código do método: switch(lista1.SelectedItem.Value) { case "C": labelSelecionado.Text = "O carro foi selecionado."; break; case "O": labelSelecionado.Text = "O ônibus foi selecionado."; break; case "M": labelSelecionado.Text = "A motocicleta foi selecionada."; break; default: labelSelecionado.Text = "Nada foi selecionado."; break; }

23. Controle WebForm –ListBox Controle bastante parecido com o DropDownList. Diferenças: Pode mostrar mais de uma opção por vez, com uma barra de rolagem. Permite a seleção múltipla de elementos.

24. Controle WebForm –ListBox No caso de controle com seleção múltipla, devemos verificar um a um os elementos marcados. Isto é feito através da propriedade Items da lista. A propriedade Items é um vetor, assim possui a propriedade Count que indica o número de elementos existem na lista e o iterador [ ] para acessar um elemento.

25. Controle WebForm –ListBox Assim, podemos acessar os elementos um a um e verificar se eles estão selecionados (propriedade Selected). Se selecionados, podemos acessar o seu valor através de Value.

26. Projeto Exemplo 3 Modifique o formulário anterior para incluir uma Listbox chamada lista2. Adicione um segundo label, chamado labelSelecionado2. Adicione os itens “Escola”, “Casa” e “Parque” à nova lista. Deixe os valores iguais aos nomes dos itens.

27. Projeto Exemplo 3 Em seguida, permita o AutoPostBack nesta lista e crie o método associado à alteração da lista. Imprima no label as opções selecionadas.

28. Projeto Exemplo 3 Código do evento: String texto = "Itens selecionados: "; for(int i=0;i<lista2.Items.Count;i++) if(lista2.Items[i].Selected) texto += lista2.Items[i].Value; labelSelecionado2.Text = texto;

29. Checkbox em Asp.Net Disponíveis em duas formas: CheckBox: controle equivalente ao Input Checkbox do HTML. CheckBoxList: controle que integra diversos checkboxes em um único componente. Estes componentes suportam, apesar de não ser o caso geral de uso, a propriedade AutoPostBack.

30. Checkbox em Asp.Net Propriedades de Checkbox: ID: nome do objeto associado ao controle no code behind. Text: o texto HTML associado ao controle. Checked: booleano que indica se o controle está ou não selecionado.

31. Checkbox em Asp.Net O controle CheckBoxList é mais parecido com o controle ListBox no modo de seleção múltipla. Propriedades importantes: ID: mesmo que nos outros controles. Items: coleção de opções da lista. RepeatColumns: número de colunas para fazer o layout do componente.

32. Checkbox em Asp.Net Como no caso do ListBox, podemos colocar itens manualmente na IDE do VisualStudio, ou diretamente na propriedade Item do controle via código: Ex: checklist.Item.Add(new Item(“Texto do Item”, “Valor”));

33. Checkbox em Asp.Net Todos os componentes que trabalham com uma coleção de items possuem um par de propriedades para cada item: Text: o texto associado ao item (exibido no HTML). Value: o valor (string) do item. Pode ser usado em comparações.

34. Projeto Exemplo 4 Como nos anteriores, iremos utilizar o controles WebForms. Assim, evite utilizar como componentes os HTML Controls. Crie um projeto para testar os componentes discutidos.

35. Projeto Exemplo Adicione dois CheckBox, com o ID cb1 e cb2, associados aos textos “Parque” e “Escola”, respectivamente. Adicione um CheckBoxList com os itens: Casa Trabalho Shopping

36. Projeto Exemplo Adicione um botão, associando-o ao texto “Envia” e com o ID “envia”. Adicione dois labels com o ID lb1 e lb2. Adicione o código de clique no botão envia, implementando a lógica para indicar em lb1 as opções selecionadas em cb1/cb2 e em lb2 as opções selecionada no cblist.

37. Projeto Exemplo Código do evento (parte 1): String texto; // Processa os checkbox if(!cb1.Checked && !cb2.Checked) lb1.Text = "Selecione alguma opção na primeira lista."; else { texto = "Opções selecionadas na primeira lista:"; if(cb1.Checked) texto+=" Parque"; if(cb2.Checked) texto+=" Escola"; lb1.Text = texto; }

38. Projeto Exemplo Código do evento (parte final): // Processa o checkbox list int count = 0; texto = "Opções selecionadas na primeira lista:"; for(int i=0;i<cblist.Items.Count;i++) if(cblist.Items[i].Selected) { texto+= " "+cblist.Items[i].Text; count++; } if(count != 0) lb2.Text = texto; else lb2.Text = "Selecione alguma opção na segunda lista.";

39. RadioButton em Asp.Net Como o checkbox HTML, o radiobutton é representado no Asp.Net por dois componentes diferentes: RadioButton: equivalente direto ao radio do HTML. RadioButtonList: similar ao CheckBoxList, fornece uma lista de radio buttons, porém permite a seleção de um único elemento. Estes componentes suportam, apesar de não ser o caso geral de uso, a propriedade AutoPostBack.

40. RadioButton em Asp.Net Propriedades de RadioButton: ID: nome do objeto associado ao controle no code behind. Text: o texto HTML associado ao controle. Checked: booleano que indica se o controle está ou não selecionado. GroupName: nome do grupo ao qual o radio button pertence. Apenas um radio do grupo pode estar selecionado.

41. RadioButton em Asp.Net Propriedades de RadioButtonList: ID: mesmo que nos outros controles. AutoPostBack. Items: coleção de opções da lista. SelectedItem: o ítem selecionado. SelectedIndex: índice do elemento selecionado na lista.

42. RadioButton em Asp.Net É possível acessar cada elemento da lista de Items como no CheckBoxList, porém como há apenas um elemento selecionado, temos disponível qual item está selecionado. Quando há um item selecionado, a propriedade SelectedIndex é maior ou igual a 0. Quando não há item selecionado, ela é igual a -1. Isto vale tanto para RadioButtonList como para DropDownList.

43. Projeto Exemplo Crie um novo formulário no projeto para testar os componentes discutidos. Para executar a aplicação e ter este formulário como o principal, basta na árvore de arquivos do Visual Studio clicar com o botão direito do mouse neste novo formulário e indicá-lo como a página inicial.

44. Projeto Exemplo Adicione dois RadioButton, com o ID rb1 e rb2, associados aos textos “Masculino” e “Feminino”, respectivamente. Ambos devem pertencer ao GroupoName Sexo. Adicione um RadioButtonList com os itens: Carro Ônibus Avião Trem O procedimento para adicionar itens é idêntico ao exercício anterior.

45. Projeto Exemplo Adicione um botão, associando-o ao texto “Envia” e com o ID “envia”. Adicione dois labels com o ID lb1 e lb2. Adicione o código de clique no botão envia, implementando a lógica para indicar em lb1 as opções selecionadas em rb1/rb2 e em lb2 as opções selecionada no rblist.

46. Projeto Exemplo Código do evento: // Testa os radio buttons if(rb1.Checked) lb1.Text = "O usuário é homem."; else if(rb2.Checked) lb1.Text = "O usuário é mulher."; else lb1.Text = "O usuário não informou o seu sexo."; // Testa o grupo de radio buttons if(rblist.SelectedIndex >= 0) lb2.Text = "O meio de transporte favorito do usuário é: " + rblist.SelectedItem.Text; else lb2.Text = "O usuário não informou o seu meio de transporte favorito.";

47. Tabelas em Asp.Net Podemos criar tabelas via código em Asp.Net. Isto é bastante prático do ponto de vista de programação, já que a tabela em si é um elemento de código ativo. A tabela é dividida em três níveis hierárquicos.

48. Tabelas em Asp.Net O primeiro é a classe Table, que cria a tabela em si. A tabela é composta por linhas, representadas pela classe TableRow. Enfim, cada linha é composta por um conjunto de células, da classe TableCell.

49. Tabelas em Asp.Net Rows é a propriedade mais importante da Table. É o vetor de TableRows, as linhas em si. Métodos importantes de Rows: Add: adiciona um TableRow Clear: elimina todas as linhas Remove: elimina uma linha.

50. Tabelas em Asp.Net Cells é a propriedade importante de TableRows. É a coleção de células da linha. Métodos importantes de Rows: Add: adiciona uma TableCell Clear: elimina todas as células Remove: elimina uma célula.