You are on page 1of 11

Formulrios HTML

Formulrios HTML
Todo formulrio em HTML construdo usando elementos dentro
de um bloco <FORM>
O bloco <FORM> define a URL que receber o formulrio e pode
definir tambm o mtodo usado

<FORM ACTION="URL para onde sero enviado os dados"


METHOD="mtodo HTTP (pode ser GET ou POST)"
ENCTYPE="formato de codificao"
TARGET="nome da janela que mostrar a resposta" >
... corpo do formulrio
(permite qualquer coisa permitida em <BODY>)
...
</FORM>
Formulrios e links
Formulrios so similares a links.
Um par formulrio-boto tem o mesmo efeito que um link criado
com <A HREF>
O link est no formulrio e o evento no boto
O bloco
<FORM ACTION="/dados/tutorial.html">
<INPUT TYPE="submit" VALUE="Tutorial">
</FORM>

gera a mesma requisio que


<A HREF="/dados/tutorial.html">Tutorial</A>

que
GET /dados/tutorial.html HTTP/1.0
Envio de dados
Vrios elementos HTML servem para entrada de dados e so usados
dentro de formulrios. Todos os elementos de entrada de dados tm
um nome e enviam um valor
Exemplo de formulrio para entrada de dados
<FORM ACTION="/cgi-bin/catalogo.pl"
METHOD="POST">
<H3>Consulta preo de livro</H3>
<P>ISBN: <INPUT TYPE="text"
NAME="isbn"/></P>
<INPUT TYPE="Submit" VALUE="Enviar"/>
</FORM>

POST /cgi-bin/catalogo.pl HTTP/1.0


Content-type: text/x-www-form-urlencoded
Content-length: 15

isbn=2877142566
Disparo de eventos
Os elementos <INPUT> com atributo TYPE Submit, Reset e Button servem para
disparar eventos
Envio do formulrio (Submit)
Reinicializao do
formulrio (Reset)
Evento programado por
JavaScript (Button)
O value do boto define
o texto que mostrar
Apenas se o boto
contiver um atributo
name, o contedo de
value ser enviado ao
servidor
Entrada de texto
Elementos <INPUT> com TYPE="text" podem ser usados para
entrada de texto

Com TYPE="password" o texto digitado ocultado na tela do


browser
Campos ocultos
Campos ocultos consistem de um par nome/valor
embutido no cdigo HTML
So teis para que o autor da pgina possa enviar
informaes ao servidor
Informaes sobre configurao da aplicao
Comandos, para selecionar comportamentos diferentes da
aplicao
Parmetros especiais para controle da aplicao, sesso ou
dados que pertencem ao contexto da aplicao
Sintaxe
<INPUT TYPE="hidden"
NAME="nome" VALUE="valor">
Chaves booleanas
H dois tipos: checkboxes e radio buttons
Checkboxes permitem mais de uma seleo

O cdigo acima enviar nomes repetidos contendo valores


diferentes na requisio
Radio Buttons, se tiverem o mesmo nome, formam um grupo. No
grupo, apenas uma seleo aceita
Upload de Arquivos
O elemento <INPUT
TYPE="file"> cria
uma tela que permite
o Upload de arquivos
para o servidor

Formulrio usado
deve ter a seguinte
sintaxe

<FORM ACTION="/servlet/UploadServlet"
METHOD="POST"
ENCTYPE="text/multipart-form-data"> ... </FORM>
rea para entrada de texto

Possibilitam a entrada de texto de mltiplas linhas


Elemento: <TEXTAREA>
Menus de seleo
Geram requisies similares a checkboxes e radio buttons
Consistem de um par de elementos
<SELECT> define o nome da coleo
<OPTION> define o valor que ser enviado