[Ajuda] Como criar formúlario HTML/PHP (Recomendado para PROFISSIONAIS) [BEM EXPLICADO]

O que vou mostrar aki é o que você não encontra em quase nenhum fórum .. o único que encontrei até hoje foi o CPHS e Club Do Hardware !! Então esse vaai ser o 3° melhor Site em DESING (Brincadeira) .. Mais tá ai !!

Os campos com "*" eu vo colocar a Legenda :

( Faça o teste com o Bloco de Notas ) = Quando falo isso é por que o Fórum Não tem a Opção HTML .. por isso falo para fazer o Teste !


___________________________________________________________________________________________

Para qualquer um que queira aprender alguma programação voltada para WEB(PHP, ASP, JAVA, etc) precisa saber como criar um formulário em HTML, já que é com eles que você irá coletar qualquer dado digitados pelo usuário.

Então irei explicar todos os passos, e as tags envolvidas, para se criar um fórmulario, e coletar os dados usando PHP.

Leitura Recomendado.
O <form></form>
A tag <form> delimita um formulário, ou seja tudo que estiver dentro dele será enviado ao clicar no botão, ela tem algumas propriedades:

<form name=”nome_do_form” method=”metodo_de_transferencia” action=”url_do_script”>

Explicando:

name: o name serve principalmente por questão de organização para vc saber o que ele faz, ele não é obrigatorio, a menos que vc tenha alguma função em javascript dai ele pode ser obrigatorio.

method: esse é o metodo que os dados serão enviados, se usam dois metodos get e post (leitura OBRIGATÓRIA ) ( Digo eu Sabrina ,que quase não entendi essa parte mas Leiam é muito bom).
name: o name serve principalmente por questão de organização para vc saber o que ele faz, ele não é obrigatorio, a menos que vc tenha alguma função em javascript dai ele pode ser obrigatorio.

method: esse é o metodo que os dados serão enviados, se usam dois metodos get e post(leitura obrigatoria)

action: aqui será o nome ou a url, do arquivo que irá “pegar” os dados digitados no formulario.

O <input>

A tag <input> é um campo para entrada de dados, essa tag não precisa ser fechada(não existe </input>).

name: o name serve principalmente por questão de organização para vc saber o que ele faz, ele não é obrigatorio, a menos que vc tenha alguma função em javascript dai ele pode ser obrigatorio.

method: esse é o metodo que os dados serão enviados, se usam dois metodos get e post(leitura obrigatoria)

action: aqui será o nome ou a url, do arquivo que irá “pegar” os dados digitados no formulario.
O <input>

A tag <input> é um campo para entrada de dados, essa tag não precisa ser fechada(não existe </input>).

<input name=”titulo”>
( Faça o teste com o Bloco de Notas* ) ,Existe os seguintes atributos para ele:name: nome do input, é usado para podermos pegar os dados, posteriormente.
id: campo opcional, usado para algumas funções com javascripttype: tipo de campo, ao qual atribuímos seis valores diferentes para gerar seis tipos diferentes de entrada de dados:

text: campo normal para digitação de textos, esse é o type padrão, caso não seja expecificado nenhum type.

<input name=”titulo” value=”texto” type=”text” />
( Faça o teste com Bloco de Notas* )
password: campo de tipo senha, ao digitar algum valor os caracteres são escondidos por asteriscos<input name=”titulo” value=”texto” type=”password” />
( Faça o Teste com o Bloco de Notas * )
Os campos do tipo text e password tem os seguintes atributos adicionais:size: comprimento da caixa de texto, o 26 representa o numero de caracteres que será visivel na telapodem ser digitados.
maxlength: numero de caracteres que poderá ser digitado.

value: Conteudo que irá aparecer no input.
hidden: campo invisivel na tela, usado para passar valores de um formulario para outro.

checkbox: botão de multipla escolha,
<input name=”titulo” value=”futebol” type=”checkbox”>Item 1
<input name=”titulo” value=”volei” type=”checkbox” checked=”checked”>Item 2, Checado
( Faça o teste Com o Bloco de Notas * ) Item 1
( Faça o teste Com o Bloco de Notas * ) Item 2 ,Checado
radio: botão de unica escolha, desde que todos tenham o mesmo name, só 1 deles poderá ser escolhido
<input name=”titulo” value=”item1″ type=”radio” />Item 1
<input name=”titulo” value=”item2″ type=”radio” />Item 2
<input name=”titulo” value=”item3″ type=”radio” checked=”checked” />Item 3, Checado
( Faça o Teste com Bloco de Notas * ) Item 1
( Faça o Teste com Bloco de Notas * ) Item 2
( Faça o Teste com Bloco de Notas * ) Item 3 ,Checado
Os campos do tipo chekbox e radio tem o atributo checked=”checked” que permite definir um item como selecionado.submit: botão para envio de dados, ele contem o value que será o texto a aparecer no botão
<input type=”submit” value=”texto” >
( Faça o Teste com o Bloco de Notas * )
A <textarea> </textarea>A tag <textarea> também é um campo para digitar qualquer valor mas ele permite ter varias linhas. Existe os seguintes atributos para ele:

<textarea name=”post” id=”post” rows=”5″ cols=”40″>Aqui fica algum texto, se quizer</textarea>

name e id: tem as mesmas funcionalidades do input.

rows: numero de linhas que haverá

cols: numero de colunas que haverá(cada coluna é o equivalente a 1 caracter).

Esses são os principais e fundamentais itens para um fórmulario, existem outros veja os aqui. Essas tags não podem ter a sua aparencia alterada, mudada somente CSS, mas existe um jeito de alterar eles usando um script em javascript.

Criando um formulário

Agora que você já conhece para que serve cada um deles vamos, criar um formulario completo, para entender completamente o seu funcionamento.

Para usar o formulário usamos 2 arquivos o primeiro terá somente o formulário, usando as tags aqui explicadas, por isso pode ser em .html. E o segundo irá coletar os dados digitados, por isso precisa ser feito usando a linguagem de programação escolhida, no caso irei explicar com PHP, por isso é preciso executa-lo em um servidor, ou em localhost com php instalado.
Para o exemplo não irei usar o radio e nem o checkbox pois são mais complicados para “pegar” o item selecionado(se tiver duvidas em como fazer isso é só perguntar), e a ideia desse artigo é ensinar o basico sobre como usar formularios.

Crie o arquivo com o formulário, chame-o de form.html, com o seguinte conteudo.

<head>
<title>Teste de Formulario com PHP</title>
<head>
<body>
<h2>Teste de Formulario com PHP</h2>
<form name="teste" method="post" action="resultado.php">
<input name="texto" type="text" /><br><br>
<input name="senha" type="password" /><br><br>
<textarea name="post" id="artigo" rows="5" cols="40"></textarea><br><br>

<input type="submit" value="Enviar">
</body>

e agora crie o arquivo que irá receber os dados, chame o de resultado.php(ou o nome que vc colocou no action do arquivo anterior), o seu conteudo será.

<?
$texto = $_POST["texto"];
$senha = $_POST["senha"];
$post = $_POST["post"];

echo "O texto digitado foi: ".$texto;
echo "<br> A senha digitada foi: ".$senha;
echo "<br> O post digitado foi: ".$post;
?>

Criamos as 3 variaveis e gravamos nela os dados que vieram do formulario usando o $_POST, depois damos um echo para exibir na tela os dados.
Bem simples não?, qualquer duvida é só perguntar.

Para quem estiver acompanhando a área Aprendendo PHP.
Leitura Obrigatoria:
Tutorial Básico PHP,Coletando informações de úsuario PHP
Leitura Recomendada: Mudando o layout dos formulários HTML

Os proximos passos/leituras são:
Comandos basicos do Mysql no PHP

Então ja só profissional, porque eu sei fazer isso de cor.
Topico movido a área destinada a php.

Muito easy isso, mais deu pro povo que so e copiar e colar ter uma noçao basico de form.
Tipo esse negocio de post voce tem que salvar na database eu to fazendo um sistema de chat que utiliza iframe por enquanto esta saindo o maximo.

Deesculpa aii ..

Prefiro fazer no netpoint x.x

Ja sou profissional '-'

o assunto é bom mais to numa preguiça de ler que nuss... só depois vou ler
bom post

Muito ótimo da pra servi para muita gente em php, o chato é qe eu ja uso php mais n tenho nenhum site para hospeda-lo, muito bom essas forms, muito bem explicado, adc nos favoritos ;D

Obrigado Sabrina eu tenho um dominio php e não sabia mecher agora ja sei o basico!!