Módulos:

1-    Introdução;

2-    A importância das validações;

3-    Pré-requisitos;

4-    Modo de utilizar;

5-    Otimizando o formulário gerado;

6-    Como trabalhar com os resultados;

7-    Agradecimentos, créditos e outras informações.

    A importância das Validações

As validações servem para filtrar os dados colocados pelos usuários, sejam eles inexperientes ou maliciosos, assim, conseguiremos melhores resultados com dados “verdadeiros”.

JavaScript: As validações em JavaScript são na máquina do usuário, mas não são totalmente eficientes devido o usuário ter controle do seu navegador, podendo a qualquer momento alterar suas configurações. Por este motivo vamos fazer as validações em PHP.

PHP: As validações em PHP são no servidor, na maioria dos casos ela não chegará a ser utilizada se o JavaScript funcionar corretamente, caso ocorrer alguma falha na máquina do usuário iremos corrigir esta falha no servidor.

    Pré-requisitos 

Para que o sistema funcione corretamente será necessária a utilização de duas classes, sendo uma em JavaScript e outra em PHP

Estas classes por convenção deverão estar dentro de uma pasta chamada “classes” na mesma pasta do arquivo gerado.

   Exemplo:

/classes/classes/classes_php.php

/classes/classes/classes_js.js

/formulário_gerado.php

Isto não significa que a maneira de organização não possa ser mudada. Desde que os arquivos continuem sendo chamados corretamente.

Modo de utilizar

    1º passo: Instruções

Após ler as instruções/manual e ter efetuado o download das classes necessárias clique em Próximo >>.

   2º passo: Dados iniciais (Configurações)

Em “Nome do formulário”, você nomeará o seu formulário, porém, este nome não deve conter nenhum espaço ou caractere especial.

Exemplos:

form_cad

formulario_cadastro

Por enquanto, vamos deixar as opções de personalização do formulário vazias e retornaremos no passo “Otimizando o formulário gerado”.

Clique em Próximo >>.

   3º passo: Determinando campos

Nesta etapa, é onde você cadastrará os campos existentes em seu formulário, para isso basta preencher os campos e clicar em adicionar campo.

Título = Título que será relacionado ao input.

Max length = Máximo de caracteres que será permitido inserir no input.

Size = Tamanho do input.

Obrigatório = Definimos se o campo é de preenchimento obrigatório.

Tipo = Definimos o tipo de campo para efetuar validações.

Tam. Mín = Definimos o mínimos de caracteres que poderão ser colocados no input.

Tam. Máx = Definimos o máximo de caracteres que poderão ser colocados no input.

Editar campo: Para editar um campo existente, clique em editar, faça as alterações necessárias e clique em Editar campo.

Apagar campo: Clique em apagar campo, leia a mensagem de confirmação e se estiver ciente do que está fazendo, clique em Sim (Confirmar).

Após estar satisfeito com os campos criados, clique em Próximo >>.

   4º passo: Resultado comentado

Pronto, o seu formulário foi criado, clique em “Ver script em funcionamento”, caso esteja satisfeito com o mesmo siga continue as instruções abaixo, se não estiver retorne ao passo número 3 clicando em << Anterior.

Selecione(Ctrl+A) todo o código apresentado dentro do textarea e copie(Ctrl+C) e cole(Ctrl+V) no seu editor PHP preferido.

Observação: O código gerado no passo número 4 é comentado, caso queira o código sem comentários clique em Próximo >>

   5º passo: Resultado avançado

Neste último passo é apresentado um código limpo, sem comentários.

Otimizando o formulário gerado

Agora que você está vendo o formulário gerado, vamos otimizá-lo, pois o mesmo ficou “bagunçado” como mostra abaixo..

Volte ao segundo passo através do botão << Anterior.

Nosso formulário é organizado basicamente desta maneira.

__Início__

__1º Parte__ Título do campo __2º Parte__ Input __3º Parte__

__Fim__

Então vamos à prática. Coloque nos campos os dados deste exemplo:

Início = <table>

   1º Parte = <tr><td>

   2º Parte = </td><td>

   3º Parte = </td></tr>

Fim =  </table>

Clique em Próximo >> 2 vezes e clique novamente em Ver script em funcionamento.

Agora nosso código fonte está semenlhante a este.

<table>

<tr>

<td> Título do campo </td><td> Input </td>

</tr>

</table>

E nosso formulário em funcionamento como abaixo.

Agora vamos a um segundo exemplo:

Volte ao passo número 2 utilizando o botão << Anterior e doloque nos campos como o exemplo:

Início = <table width=”350”>

   1º Parte = <tr><td width=”150” bgcolor=”#cccccc”><font color=”#999999”>

   2º Parte = </font></td><td width=”200” bgcolor=”#000000”>

   3º Parte = </td></tr>

Fim =  </table>

Clique em Próximo >> 2 vezes e clique novamente em Ver script em funcionamento.

Agora nosso código fonte está semenlhante a este.

<table width=”350”>

<tr>

<td width=”150” bgcolor=”#cccccc”><font color=”#999999”> > Título do campo </font></td><td width=”200” bgcolor=”#000000”>

Input </td></tr>

Fim =  </table>

 E nosso formulário em funcionamento como abaixo.

Estes 2 exemplos citados acima tem o objetivo de demonstrar como o formulário pode ser personalizado, utilizando de suas necessidades podendo ser feito em HTML comum, HTML com CSS, JavaScript, Tableless e etc...

Como trabalhar com os resultados

Agora que já temos um formulário que satisfaça a necessidade e o código no editor de PHP como abaixo vamos trabalhar com o script.

Neste Sistema foi adotado que ao criar os campos cada Título foi ligado a um input com nome de campo[x] para evitar que ocorra falhar com variáveis com espaço, caracteres especiais e etc.

Tentar mudar o nome dos campos e variáveis para outros não é aconselhável, pois pode ocorrer falhas, caso queira tentar utilize a opção de substituir, não faça manualmente que desta forma estará se expondo a uma maior chance de erros.

Caso siga me conselho faça uma busca por “As variaveis envolvidas no formulário” no script, neste ponto foi criada uma referencia com o títulos e campo[x].

No meu caso é apresentado da seguinte maneira.

Name = $campo0;

Email = $campo1;

Phone = $campo2;

Comments = $campo3;

Agora faça a sua referencia para que possa trabalhar mais amigavelmente com o script que trabalhar com variáveis $campo0,1,2,8,9,15 pode ser confuso.

Exemplo:

$name = $campo0;

$email = $campo1;

$phone = $campo2;

$comments = $campo3;

Agora trabalhe a vontade fazendo inserções em banco de dados, enviando e-mail, como desejar.

Exemplo:

$conteudo = '

Name = '.$name. '<br>

Email = '.$email. '<br>

Phone = '.$phone. '<br>

Comments = '.$comments. '<br>

';

$assunto = 'Comment from site';

$email = 'email@domain.com'

$from = ''.$name.'< '.$email.' >';

@ mail ($email, $assunto, $conteudo, "From: $from\nContent-type:text/html;charset=ISO-8859-1;MULTIPART/related");

Para fazer este formulario enviar email bastaria colocar isto abaixo do comentário que tem como fim está frase “Desta forma  ficará muito mais fácil de trabalhar evitando confusões

*/”