Formulários com validação

Em nosso formulário iremos utilizar sete elementos para o envio dos dados. Serão eles:

01. Campo de texto para o nome02. Campo de texto para o email03. Campo de texto para a cidade04. Campo de texto para a mensagem05. Um select com a lista dos estados06. O botão “Apagar”07. Botão “Enviar”

Abaixo você confere um exemplo de como ficará nosso formulário ao concluirmos:

Abra o arquivo “form_contato.fla” em seu Flash (só irá funcionar no Flash MX 2004 ou Flash 8. Se tem uma versão mais antiga, sugiro seriamente que se atualize o quanto antes) e vamos primeiramente à layer (camada) “form”.

Crie quatro campos do tipo input text, um para cada título do formulário (nome, email, cidade e mensagem), selecionando a ferramenta de texto, clicando no stage e, após criar, vá até a barra “Properties” (Propriedades) e mude de “Static Text” para “Input Text”, conforme a figura abaixo:

Feito isso, vamos atribuir um nome de instância a cada um dos input texts criados.

Selecione o campo referente ao nome, na mesma barra Properties, digite “nome_txt” – sem aspas - no campo <Instance Name> (nome de instância), em seguida digite “var_nome” – sem aspas - no campo “Var”, conforme a figura abaixo:

Repita esse procedimento com cada um dos campos de texto criados, alterando apenas seus nomes, conforme a lista abaixo:

E-mailCampo Instance Name: email_txtCampo Var: var_emailCidadeCampo Instance Name: cidade_txtCampo Var: var_cidadeMensagemCampo Instance Name: mensagem_txtCampo Var: var_mensagem

Agora criaremos o campo select, que conterá a lista de Estados. Para economizar nosso tempo, apenas criaremos a lista com dois estados “SP” e “ES”, mas você poderá colocar todos depois. Abra a Components (components) pressionando “Ctrl + F7”.Em seguida, em User Interface, dê um duplo clique sobre o componente “ComboBox”, como mostra a figura abaixo:

Posicione-o ao lado direito do campo referente à Cidade e diminua seu tamanho, para que fique com espaço para dois digitos, 50 pixels de width (largura) é o ideal.

Selecione o componente que acabamos de criar, digite “estados_cb” – sem aspas - no campo <Instance Name>. Em seguida, clique sobre a opção “Parameters” e depois dê um duplo clique sobre a opção “labels”.

Na janela que se abrir, clique no ícone “+” duas vezes e em cada linha criada, digite as iniciais de um Estado brasileiro. No meu caso, digitei “SP” e “ES” – sem aspas.

Vale lembrar que a opção que ficar na primeira linha será a padrão, que vai aparecer automaticamente.

Agora vamos criar os dois últimos objetos do nosso formulário, que são os botões “Enviar” e “Apagar”. Com a ferramenta texto, digite a palavra “Enviar”, depois “Apagar” – ambas sem aspas. Certifique-se de que esses textos criados não sejam do tipo “Input” e sim do tipo “Static”.

Selecione a palavra “Enviar” e pressione “F8” para abrirmos a janela de criação de símbolos. Digite “enviar_btn” no campo “Name” e em “Type” escolha a opção “Button”, conforme a figura abaixo:

Feito isso, no campo <Instance Name> da barra “Properties”, digite novamente “enviar_btn”.

Faça o mesmo com a palavra “Apagar”, apenas trocando os nomes para “apagar_btn”.

O principal está pronto, vamos agora para a etapa de validação dos dados informados pelo usuário.

Etapa de validação

Com a ferramenta de texto, crie um Dinamic Text (texto dinâmico), criando um texto no stage e mudando na barra “Properties” de “Static Text” para “Dinamic Text”.

Selecione o campo que acabamos de criar e no campo “Var” da barra “Properties”. Digite “var_status” – sem aspas.

Feito isso, selecione o primeiro frame da layer (camada) “Actionscript” e pressione “F9” para abrirmos a paleta “Actions”. Em seguida digite:

#include “Acoes.as”

Essa linha importará as ações digitadas no arquivo “Acoes.as”. Agora, abra o arquivo “Acoes.as” no seu Flash para conferir a programação, cada etapa está explicada com comentários.

A página “email.asp” é a responsável por receber os dados e enviá-los para o e-mail informado. Abra-a e mude o endereço de e-mail e o nome do recipiente da mensagem.

E vale lembrar que essa página só funcionará se estiver hospedada em um servidor que trabalhe com ASP. Para outras tecnologias, como PHP, JSP, CFM, será necessário desenvolver uma página semelhante a essa, que receba as variáveis da maneira correta.