|
Tutoriais » HTML » Formulários » Na HTML é permitido que o usuário interaja com o servidor através de formulários ligados à scripts CGI. Uma boa parte dos servidores não oferecem este recurso, mas existem vários serviços gratuitos na web que transformam os dados de um formulário em mensagens de e-mail. Isso pode ser útil para estabelecer contatos com parceiros de trabalho sem a necessidade de se instalar servidores de bancos de dados. No entanto se o que se pretende é a implementação de sistmeas de informação, então, invariavelmente, teremos que instalar e configurar um Servidor de Banco de Dados no Servidor e fazer os dados passarem do Servidor HTTP para o Servidor de Dados através de uma camada de software (o CGI). O ambiente CGI pode ser implementado através de uma variedade de linguagens de computação. Atualmente (2005) se usa mais PHP. Se você quiser ter uma idéia da distribuição de Sistemas Operacionais e de Servidores de Páginas, etc visite o site http://www.webtrends.com lá você pode procurar saber de estatícas de uso da Net. Antes de irmos para as TAGS propriamente ditas, temos que tecer alguns comentários. O Serviço HTTP tem uma limitada capacidade no tratamento de valores digitados em formulários. Assim é necessário passar os valores dos dados digitados (e seus respectivos nomes de campos) para um outro programa o servidor, este programa 'roda' em um ambiente independente do HTTP, mas 'conectado' a este ambiente. A passagem de valores do HTTP para o ambiente CGI pode ser feita de dois modos, diremos métodos: get Diz ao CGI para olhar os valores digitados em uma variável de ambiente. A variável se chama QUERY_STRING e seu valor tem a seguinte estrutura: NomeDoCampo1=Valor1&NomeDoCampo2=Valor2&...&NomeDoCampo3=Valor3 Esta técnica apresenta uma limitação: o tamanho do conteúdo da variável é limitado (4000bytes). Era um valor grande... mas hoje em dia já existem formulário que podem receber este volume de dados. Cabe ao programa do ambiente CGI 'quebrar' a variaável QUERY_STRING em pares de atribuições. O outro método de passagem é: post Envia os dados para o ambiente CGI usando um truque. Coloca o conteúdo sequencialmente na memória (RAM) do servidor e referencia o inicio do endereçamento e o comprimento em duas variáveis: CONTENT_TYPE e CONTENT_LENGTH. Isso permite que uma quantidade maior de dados possa ser 'passada' entre os serviços. Esta passagem de valores ocorre 'dentro' do servidor. Entre o servidor e o cliente (que preencheu o formulário) existe a passagem destes valores 'dentro' de pacotes TCP/IP. Por isso qualquer programa de monitoramento de pacotes pode 'olhar' o conteúdo trafegado. Se uma aplicação precisar de sigilo no transito dos dados, então é necessário instalar um programa de criptografia no servidor e no cliente. Os dados digitados em um formulário serão tratados 'antes' de sairem do Cliente, trafegam criptografados e são descriptografados no Servidor. É claro que isso complica um pouco a vida do Cliente... mas pela segurança, se justifica! Bem vamos às TAGs... <form></form> Determina o início e o fim de um formulário. O form possui dois atributos que determina o destino da informação do formulário. Nesta TAG temos que informar mais dois valores (em atributos da TAG): O nome do programa do ambiente CGI que vai receber os dados e o método de transmissão. Assim usamos: action Indica o nome do programa que vai receber os dados method Diz ao ambiente CGI como os dados estão sendo passados. Hoje em dia, como as memórias RAM estão com preço bem mais acessíveis está se usando com maior frequencia o método POST. Agora vamos começar a ver como podemos formatar as mais diversas formas de exibição dos campos para digitação de um formulário.
A TAG <input> especifica vários campos dentro de um formulário. Ele pode receber diversos atributos que definem o tipo de campo (botão, caixa de texto, etc). O atributo mais importante do input é o name, ele cria a variável que recebe o valor digitado pelo usuário.
Caixa de texto em tamanho maior. <textarea width=largura height=Altura name='caixa'>Texto</textarea> Veja como ficou: colocando width=20 e height=7 Select Menu com várias opções para o usuário escolher. <select> <option select>menu</option> <option>opção</option> <option>opção2 </option> </select> Veja como ficou: Atributos de TAGs Existem atributos que podem ser colocados nas tags para alterar a forma de funcionamento, dentre eles indicacmos:
O elemento Form possui um certo grau de complexidade, para facilitar dê uma olhada no exemplo completo que utiliza o serviço gratuito AnyForm. Você precisa alterar os dados e-mail e endereço da página. HTML | Introdução | Básico | Texto | Links | Imagem/Linha | Tabela | Formulário | Frame | Refresh © João Maurício Hypólito - Ourinhos/SP |