Aplicativo aula05

190 visualizações

Publicada em

0 comentários
0 gostaram
Estatísticas
Notas
  • Seja o primeiro a comentar

  • Seja a primeira pessoa a gostar disto

Sem downloads
Visualizações
Visualizações totais
190
No SlideShare
0
A partir de incorporações
0
Número de incorporações
3
Ações
Compartilhamentos
0
Downloads
1
Comentários
0
Gostaram
0
Incorporações 0
Nenhuma incorporação

Nenhuma nota no slide

Aplicativo aula05

  1. 1. Aula 005 Aplicativos PRONATEC Programa Nacional de Acesso ao Ensino Técnico e Emprego
  2. 2. PRONATEC Programa Nacional de Acesso ao Ensino Técnico e Emprego
  3. 3. 1. Formulários HTML • <form>...</form> define um formulário dentro do documento html o que está interno à tag • Parâmetros: ACTION indica a ação a ser tomada na submissão do formulário: abrir um novo documento, enviar um email ou executar um script • Method: POST – os dados do formulário são enviados de forma oculta, GET os dados são enviados descritos na própria URL separados pelos caracteres “?” e “&” • Exemplo de URL com GET: www.pronatec.com/cadastra.php?codigo=1&nome=cl audio%20luis – indica chamado GET com dois campos: “codigo” valendo “1” e “nome” valendo “claudio luis”
  4. 4. 2. Elementos de Formulários • Dentro dos <form>..</form> podemos incluir diversos elementos próprios de formulários : • Caixa de entrada de texto curto • Caixa de entrada de texto longo • Lista de opções • Botões de rádio • Caixas de validação • Botões: enviar, apagar e personalizados
  5. 5. 3. Texto Curto • <INPUT type=text name=nome value=texto id=t1> • TYPE: text indica texto comum curto • NAME: nome do elemento para o formulário • ID: identificador único do objeto para javascript • VALUE: valor de texto padrão para aparecer, esse valor também será o conteúdo entrado pelo teclado • Pode ser usado com senha se type=“password” • Pode limitar o tamanho com SIZE=Nº caracteres
  6. 6. 4. Lista de Opções • <SELECT> <OPTION>..</OPTION>...</SELECT • Exemplo: <SELECT name=estação> <OPTION>Primeiro</OPTION> <OPTION>Segundo</OPTION> <OPTION>Terceiro</OPTION> </SELECT> • Monta uma lista de opções com 3 itens: Primeiro, Segundo ou Terceiro. • O tipo de lista é “caixa combinada”, você clica na seta da direita para abrir a lista e escolher qual deseja • Parâmetro SELECT: NAME=nome do elemento, ID=identificador do elemento • Parâmetro OPTION: NAME=nome da opção para o formulário, VALUE = valor numérico ou texto assumido pelo SELECT quando essa opção for escolhida
  7. 7. 5. Botões de Rádio • <INPUT type=radio name=estação value=1>Primavera <BR> • <INPUT type=radio name=estação value=2>Verão <BR> • <INPUT type=radio name=estação value=3>Outono <BR> • <INPUT type=radio name=estação value=4>Inverno <BR> • TYPE: sempre “radio” • NAME: o mesmo para o grupo de botões, se for diferente pertence a outro grupo • VALUE: valor assumido pelo grupo quando esse botão for selecionado • CHECKED: indica que o botão está marcado (ativo)
  8. 8. 6. Caixa de Validação • <INPUT type=checkbox name=ativo>Ativado • TYPE: sempre “checkbox” • NAME: nome do elemento para o formulário 7. Botão Enviar Dados • <INPUT type=submit name=ok value=Enviar> • TYPE: sempre “submit” • NAME: nome do elemento para o formulário • VALUE: texto que aparece no botão • Sempre que clicado o formulário executará ACTION
  9. 9. 8. Botão Apagar Campos • <INPUT type=reset value=Apagar Campos> • TYPE: sempre “reset” • VALUE: texto que aparece no botão • Sempre que clicado volta o formulário ao estado padrão 9. Dados ocultos • <INPUT type=hidden name=site value=1> • TYPE: sempre “hidden” • NAME: nome do elemento no formulário • VALUE: valor que fica oculto e será enviado • Serve para conter valores pré-definidos

×