Navegação

HOME
Gerador descriptad
Gerador de popup
Gerador de status
Gerador meta targ
Gerador de janelas
Gerador de iframes
Script
Gerador criptografia
Gerador de códigos
Editor de HTML
Gerador  formulários
Gerador botão link
Gerador lero lero
Gerador maito
Gerador de menu
Gerador de txt
Gerador de pop aut
Relogio legal
Transição de página
Entre em contato
Livro de visitas

Eletrônica

Substituição de CIs
Projetos
Caracteristica de TR

Fabricantes

Novidades

mais
AP
Na loja fransat

Busca Rápida

 
Use palavras-chave para achar o que procura.
Busca Avançada

Interação

Mural Admiral
Mural Simples
Batepapo
Portal
Newsletter
DuplaSena
LotoFacil
LotoMania
Quina
MegaSena

Links importante

Hora certa
Receita federal
Segurança
Ambiental
Anatel
Consulta correios
Procon SP
Tradutor

Para melhor visualização configure sua resolução para 1024x768 pixel

 

 

Gerador de códigos

Sistema gerador de formulários com validação em JavaScript e PHP

    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

*/”

 

       

inscreva em nossa newsletter para receber em seu email novidades é grátis, e quando não querer mais receber mensagens,  pode desinscrever pelo formulário

Pesquisa

Pesquisa personalizada
 

Atendimento online

Webmail

E-mail:
Senha:


[Clic aqui para login] [Não sou cadastrado][Lembrar senha]

Produtos da loja

Antena Aquarios
01.
Antena aquarios
Linksys wireless
02.
Linksys wireless
AP edimax
03.
AP edimax

New Page 1

teste

Noticias atualizadas

Industria de bebedouro

Piadas

Liberis

Magia & Sedução

Sexyin

Pingamor

Código de cores HTML

Radio FM

Teste de conexão

Geocounter

Cem Comentário

úteis


Buscar Telefones

Visitas online