Diese Präsentation wurde erfolgreich gemeldet.
Wir verwenden Ihre LinkedIn Profilangaben und Informationen zu Ihren Aktivitäten, um Anzeigen zu personalisieren und Ihnen relevantere Inhalte anzuzeigen. Sie können Ihre Anzeigeneinstellungen jederzeit ändern.

Formularios

1.453 Aufrufe

Veröffentlicht am

apresentação

Veröffentlicht in: Bildung
  • Als Erste(r) kommentieren

  • Gehören Sie zu den Ersten, denen das gefällt!

Formularios

  1. 1. Formulários Desenvolvimento para Web I Denise Aristimunha de Lima | URCAMP | CCECA Técnico em Informática | 2010 1 Para que serve? Manipulação de forma avançada, de um conjunto de dados específicos; Estabelece contato; Podem conter vários tipos de dados; É um recurso indispensável em sites dinâmicos. 2 1
  2. 2. 3 4 2
  3. 3. Utilizando elementos estéticos através do CSS – Cascading Style Sheets 5 Comandos utilizados <form> </form> Determina início e o fim de um formulário. Parâmetros: Action - Define o endereço de recepção de dados. Method – Define o método de envio de dados que pode ser: Get ; Post. 6 3
  4. 4. Sintaxe <form action=“mailto:denise@urcamp.tche.br” method=“post”> . . . </form> Entre o elemento form e seu fechamento /form vão todos os outros elementos que irão compor o formulário. 7 Formatações para entrada de dados: Em especial, colocamos dentro da marcação de <FORM> as formatações para campos de entrada de dados, que são três: <INPUT>, <SELECT> e <TEXTAREA> 8 4
  5. 5. <input> (elemento vazio) Atributos name=“nome” define o nome do campo a ser utilizado para guardar um determinado dado; type=“tipo” define o tipo do elemento; que pode ser: text, submit, reset, radio, checkbox, password, file; value=“valor” define o valor básico do elemento. Aquele que é identificado como padrão para o momento; Maxlength=“número” define quantos caracteres o campo pode aceitar; size= “número” define o tamanho do campo a ser exibido. 9 Type= “text” <html> <head> <title>Aula - Formulário</title> </head> <body> <form action=“mailto:denisealima@gmail.com" method="post"> <input type="text" name=“formulário” size=“20” maxlength=“15” value="campo"> </form> </body> </html> 10 5
  6. 6. Type=“radio” (permite escolher apenas uma opção em uma lista) <form action=“mailto:atendimento@urcamp.tche.br” method=“post”> <input type=“radio” name=“opção1”>Manhã <br> <input type=“radio” name=“opção2” >Tarde <br> <input type=“radio” name=“opção3” >Noite </form> 11 Com o rádio pode-se escolher só uma opção Type=“checkbox” (Com o checkbox pode-se escolher mais de uma opção) <form action=“mailto:atendimento@urcamp.tche.br” method=“post”> <input type=“checkbox” name=“opção1”>Manhã <input type=“checkbox” name=“opção2”>Tarde <input type=“checkbox” name=“opção3”>Noite </form> 12 6
  7. 7. Type=“password” <form action=“mailto:atendimento@urcamp.tche.br” method=“post”> <input type=“password" name=“senha" size="10" maxlength="5"> </form> 13 Type=“submit” <form action="mailto:secretaria@urcamp.tche.br" method=“post”> <p>Comentários: <br><textarea name="obs" value="vazio" rows="5" cols="80"></textarea></p> <input type="submit" value="enviar"> </form> 14 7
  8. 8. Select (elemento container - <select> </select>) Name=“nome” – indica um nome. Size=“valor” – define quantas opções aparecerão ex.: size=“5”; <Option> </option> – elemento usado para cada opção no combo. 15 Select/option <form action=“mailto:cadastro@urcamp.tche.br” method=“post” > <select name=“dia_semana”> <option>segunda</option> <option>terça </option> ... </select> </form> 16 8
  9. 9. Textarea (elemento container - <textarea> </textarea> Name – define um nome. Rows – define a altura com base no número de linhas; Cols – define tamanho da largura com base em número de colunas. 17 Textarea Permite que o usuário escreva múltiplas linhas de texto <form method=“post” action=“mailto:denisealima@gmail.com"> <p>Comentários: <br><textarea name="observação" rows="5" cols="80"></textarea></p> </form> 18 9
  10. 10. Elemento TEXTAREA com os botões de limpar campos e enviar atravé através do elemento INPUT <form action=“mailto:denisealima@gmail.com method=“post” > <p>Comentários: 19 < name="obs" value="vazio" ="obs <br><textarea name="obs" value="vazio" rows="5" cols="80"></textarea> ="80"></textarea rows="5" cols="80"></textarea></p> Exercício 20 10
  11. 11. Bibliografia SILVA, Maurício Samy. Criando Sites com HTML. São Paulo: Novatec Editora, 2008. 21 11

×