Aula03 CompApl PraSInf

COMPAPL PRASINF – MODELO APRESENTAÇÃO
Aula 03 - Formulários HTML programados com Javascript
Prof. Jorge L. Pirolla

Formulários em HTML
Os Formulários em HTML são usados para selecionar diferentes tipos de entradas do usuário.
Dentre os tipos mais usados temos:
• text
• password
• email
• radio
• number
• select
• range
• textarea

Como criar um formulário
Os formulários são criados a partir da tag <form>.
Por exemplo:
Método para envio dos dados do formulário

<form method="post" id="form1" action="mailto:[e-mail]" oinput="exec();"> Identificação do formulário
Ação que será executada quando formulário for submetido Função que será executada a cada alteração do formulário

CONTEÚDO DO FORMULÁRIO
</form>

Principais Tipos de Entradas
<input type="text">
<p>Nome:
<input type="text" name="tNome" id="cNome" size="20" maxlength="30" placeholder="Nome completo" />
</p>

<input type="password">
<p>Senha:
<input type="password" name="tSenha" id="cSenha" size="8" maxlength="8" placeholder="8 dígitos" />
</p>

<input type="email">
<p>E-mail:
<input type="email" name="tEmail" id="cEmail" size="30" maxlength="30" placeholder="E-mail válido" />
</p>

<input type="radio">
<input type="radio" name="tSexo" id="cMasc" checked />Masculino
<input type="radio" name="tSexo" id="cFemi" />Feminino

<input type="submit">
<input type="submit" value="Enviar"/>

Principais Tipos de Entradas
Poderíamos criar uma seção dentro de um formulário chamada Identificação do Usuário e fazê-la assim:
<fieldset id="usuario"> <legend>Identificação do usuário</legend> <p>Nome: <input type="text" name="tNome" id="cNome" size="20" maxlength="30" placeholder="Nome completo" /></p> <p>Senha: <input type="password" name="tSenha" id="cSenha" size="8" maxlength="8" placeholder="8 dígitos" /></p> <p>E­mail: <input type="email" name="tEmail" id="cEmail" size="30" maxlength="30" placeholder="E­mail válido"/></p> <fieldset id="sexo"><legend>Sexo</legend> <input type="radio"