Formulários HTML

Formulários HTML são um dos principais pontos de interação entre um usuário e seu site.

Na prática, esses elementos permitem que usuários possam enviar informações para nosso site e a partir dessas informações, nós podemos responder conforme a entrada de dados.

É através que podemos coletar dados dos nossos usuários, como nome, e-mail, telefone e outros tipos de informações necessárias. Um bom uso de formulários HTML é em ferramentas de automação de e-mail marketing.

HTTP – Hypertext Transfer Protocol (Protocolo de Transferência de Dados) é um protocolo ou padrão de rede implementado em cima do TCP para que navegadores possam interoperar.

A tag <form>

Os formulários são delimitados pela tag FORM que permite reunir outros elementos HTML como campo de digitação, checkbox e botões.

Métodos de envio de dados

Quando o formulário é preenchido e enviado, os dados presentes são trafegados até o seu servidor de aplicação. O HTML permite dois tipos de envio de dados: post e get.

Método GET

No envio do método GET é feito através do uso da URL. Quando o botão do envio do formulário for acionado, o resultado será algo parecido co meste:

<form action="formulario.php" method="get">
    <p>
        Nome:  <input type="text" name="username" value="João Inácio" />
    </p>
    <p>
        E-mail: <input type="text" name="email"  value="[email protected]" />
    </p>
    <p>
        <input type="submit" value="Inscreva-se" />
    </p>
</form>

O resultado será algo similar a este:

Método Post

Um formulário fazendo requisição POST, é a forma mais segura para envio de informações.

<form action="formulario.php" method="post">
    <p>
        Nome:  <input type="text" name="username" value="João Inácio" />
    </p>
    <p>
        E-mail: <input type="text" name="email"  value="[email protected]" />
    </p>
    <p>
        <input type="submit" value="Inscreva-se!" />
    </p>
</form>

Como o método POST não afeta a url, ela ficará simplificada:

  • http://www.site.com.br/formulario.php

Atributos

O atributo Name (nome) é essencial porque permitirá que o script CGI conheça o campo associado ao par nome/valor, ou seja, o nome do campo será seguido do caractere “= e do valor digitado pelo usuário ou, ao contrário, do valor padrão localizado pelo atributo value.

O atributo type permite determinar qual é o elemento que representa a tag INPUT. Veja os valores que este campo pode ter:

Elementos que podem ser utilizados em formulários

  • checkbox: são caixas a serem marcadas que aceitam dois status, o checked (marcado) e unchecked (não marcado). Seu valor é boleano.
  • hidden: trata-se de um campo oculto. Este campo não é visível no formulário nem para seu usuário. Permite adicionar alguma informação que será recebida pelo servidor de aplicação.
  • file: Permite que o usuário especifique um arquivo para que seja enviado junto com o formulário
  • imagem: é um botão de proposta personalizado, cuja aparência é a imagem situada no lugar indicado pelo seu atributo SRC.
  • password: este é o campo especial feito para senha. Ele aparece como camuflado (*).
  • radio: é um botão que permite fazer uma escolha entre várias outras.
  • submit: é o botão de envio de formulário.
  • text: é um campo de digitação livre que permite inserir uma linha apenas.