Aula 3

Aplicações para Internet

Conteúdo:
• HTML5
– Formulários

Professores:
Alcides Teixeira
Ana Paula
Cristiane Camilo
Manuel Ledón
Pedro Cacique

Formulários
•

Quem nunca preencheu um formulário de cadastro na WEB? A ideia de formulário todos conhecem. Em resumo, sua principal utilidade é coletar os dados do usuário e fazer algum tipo de processamento no servidor, porém também podemos utilizar para processar algo em JavaScript, no cliente.

•

Podemos criar nossos formulários através do HTML utilizando tags para cada tipo de elemento de entrada de dados. No HTML5 também temos alguns atributos que irão facilitar a validação do formulário sem a necessidade de desenvolver scripts em outras linguagens, ou seja, para validar alguns dados não precisaremos utilizar o JavaScript diretamente.

Formulários
• Como a linguagem HTML5 ainda está em desenvolvimento, alguns atributos e comandos de formulários não são compatíveis com todos os navegadores, por isso iremos utilizar somente o que for compatível com pelo menos dois navegadores (Google Chrome e Firefox).
• Para criarmos um formulário podemos utilizar a tag <form> ou em alguns casos somente o elemento como um botão para disparar uma ação na nossa página.
•

Tag form
<form name="form1" method="post" action="">
Elementos do formulário
</form>
get ou post

Endereço, página do servidor

Formulários (tag input)
• Tag para entrada de dados, que poderá ter diversas variações, conforme exemplos abaixo:
•

Exemplos:
Nome: <input type="text" name="nome" />
Senha: <input type="password" name="senha" />
E-mail: <input type="email" name="usermail" /> (está opção irá validar o campo de e-mail)
URL: <input type="url" name="homepage" /> (usado para validar URLs)
<input type="submit" value="Enviar" /> (Para enviar o form para o servidor)

Omitimos a tag label (ver depois) para facilitar o exemplo.

Formulários (tag input) cont.
•

Campo oculto
<input name="oculto" type="hidden" value="algumacoisa">

•

Checkbox (o usuário pode marcar