HTML Básico - Criação de Formulários - Parte 2

helldanger1 · Nov 27, 2007

Objetivo: O objetivo deste último tutorial é dar continuida ao desenvolvimento do formulário, vou ensinar a utilizar outros elementos necessários para um formulário e seus atributos, tudo mostrado de forma simples e objetiva através das telas.

Pré-requisito: Para você poder acompanhar o desenvolvimento deste tutorial, será necessário ter conhecimento no mínimo do de informática básica e Parte 1, Parte 2, Parte 3 , Parte 4, Parte 5, Parte 6, Parte 7, Parte 8, Parte 9, Parte 10 e Parte 11 do tutorial html básico.

Nota: Irei ensinar a linguagem de html de uma forma bem objetiva, ou seja, iremos aprender na prática através da criação páginas.

Vamos utilizar a mesma página formulário.html que criamos no tutorial parte11.

<html>

<head><title>Criação de Formulários</title></head>

<body>

<center>

<h2>Criação de Formulários</h2>

<br><br>

</center>

</body>

</html>

helldanger1 · Nov 27, 2007

Veja a página abaixo:

Tela 001

Vamos utilizar um elemento para a criação de uma lista de opções, para isso utilizamos as etiquetas <select></select> e dentro das mesma utilizamos a etiqueta <option></option>, nesta inserirmos o texto, por exemplo, digamos que você tenha queira disponibilizar ao seu cliente que ele selecione qual dia da semana prefere sair de férias, logo, vamos criar uma lista com os dias da semana, que vai ficar da seguinte maneira:

Tela 002

Tela 003

Podemos utilizar o atributo multiple para selecionar varios registros ao mesmo tempo, veja o procedimento.

Tela 004

Tela 005

Podemos utilizar os botões de radio, através das etiques <input>inserindo no atributo Type a palavra “radio”, este vai fazer com que o cliente selecione apenas uma opção por vez.

helldanger1 · Nov 27, 2007

Tela 006

Tela 007

Também podemos utilizar a caixa de validação, a única diferença é que podemos selecionar mais de uma opção ao mesmo tempo, e podemos ativa-la pelo atributo checkbox.

Tela 008

Tela 009

Agora iremos aprender a criar o botão submit, que serve para enviar o formulário para o lugar determinado no atributo action, onde utilizamos a atributo value para determinar o nome do mesmo.

helldanger1 · Nov 27, 2007

Tela 010

Tela 011

Por ultimo criamos um botão para limpar os campos de um deteminado formulário, irei criar um pequeno formulário, sua sintaxe é a seguinte.

Tela 012

Tela 013

Mostrei as etiquetas para a criação de elementos para utilização em formulários bem como seus atributos, tudo de forma bem objetiva e mostrado através das telas para que você tenha uma melhor entendimento possível, acabei a série de tutoriais sobre html, espero que os mesmo possam ajuda-lo no seu aprendizado

arjames · Nov 10, 2008

Ajuda Formulario dá erro

Caros amigos , em especial o amigo, helldanger1 que colocou aqui como fazer um formulario.

Copiei o código do formulario que foi colocado aqui e dá um erro, não sei o que está mal, agradecia a ajuda.

em anexo deixo uma imagem do erro

ver aqui: *ww.ar-vending.com/email_me.html
Obrigado
Abraço

helldanger1 · Nov 10, 2008

arjames disse:
Caros amigos , em especial o amigo, helldanger1 que colocou aqui como fazer um formulario.

Copiei o código do formulario que foi colocado aqui e dá um erro, não sei o que está mal, agradecia a ajuda.

em anexo deixo uma imagem do erro

ver aqui: *ww.ar-vending.com/email_me.html
Obrigado
Abraço

verifica na tela 8 se meteste o teu mail na linha correcta

arjames · Nov 10, 2008

Amigo poderias-me fazer o favor, como as letras na imagem estão muito pequenas e não consigo ver bem , poderias colocar os códigos aqui em bloco de notas?
Obrigado Abraço.

maar3amt · Nov 10, 2008

Arjames substitui no código fonte mailito por mailto

maar3amt · Nov 10, 2008

Mais propriamente faz o seguinte.

Localiza:

<form action ="mailito:ar_vending@hotmail.com" method="post">
nome <input type="text" name="nome" size="10" maxlengh="100">
<br>
E-mail <input type="text" name="email" size="25" maxlengh="100" value="6">
<br>
Cidade <input type="text" name="cidade" size="20" maxlengh="60">
<br>

<br>
<listar opinião
<br>
<textarea cols="20" rows="5" name="opiniao"></textarea>
<br>
<input type="submit" value="Enviar formulário">
<br>
<br>
<input type="reset" value="Apagar tudo">
</form>

e substitui por:

<form action ="mailto:ar_vending@hotmail.com" method="post">
nome <input type="text" name="nome" size="10" maxlengh="100">
<br>
E-mail <input type="text" name="email" size="25" maxlengh="100" value="6">
<br>
Cidade <input type="text" name="cidade" size="20" maxlengh="60">
<br>

<br>
<listar opinião
<br>
<textarea cols="20" rows="5" name="opiniao"></textarea>
<br>
<input type="submit" value="Enviar formulário">
<br>
<br>
<input type="reset" value="Apagar tudo">
</form>

Amigo desculpa estar a fazer uma critica (construtiva) este método já não se utiliza...
Se o teu servidor suportar php seria melhor, mais cómodo e funcional fazer isto em php. :espi28:

arjames · Nov 10, 2008

Obrigado amigo vou testar,olha eu não sei fazer em php, será que me podes fazer ou explicar como se faz?que até seria melhor.
Abraço

maar3amt · Nov 10, 2008

Ok logo irei postar aqui um script meu em php.:espi28:

maar3amt · Nov 10, 2008

Olhe amigo veja lá se isto lhe serve.

http://www.gforum.tv/board/582/283412/formulario-de-contacto-em-php.html

Cumps maar3amt

arjames · Nov 10, 2008

tentei fazer como o amigo maar3amt colocou no su poste.
mas não está a funcionar corretamente, dexo um anexo para ver o que esta mal
Outra coisa no no Dremwever abri uma página em branco em php e então copiei os cogigos , coloquei o e mail a enviar.e salvei no servidor com e dei o nome à minha página*ww.ar-vending.com/contactos.php , pergunto eu é assim?
podem dar um vista de olhos e dizerem -me alguma coisa.

já agora o é formulario é geraldo ou enviado por inovador.net@gmail.com ?? o que é, é um servidor???
Abraço

maar3amt · Nov 11, 2008

Olá amigo porque dizes que não está a funcionar bem?
Ele está a funcionar correctamente os campos é que podes ter de acrescentar ou retirar depende das tuas necessidades...
Quanto ao email ele é enviado pelo sendmail do servidor ou postfix depende do do servidor que tenhas no servidor.
Se disseres quais são os campos de que necessitas poderei dar um jeito e adapta-lo ás tuas necessidades.

arjames · Nov 11, 2008

Pedido de formulario

Boas amigo, então se não for pedir muito se puderes fazer o formulario que te deixo em anexo, agradecia.

Depois diz alguma coisa,
Abraço
Arjames

Kangoroo · Nov 14, 2008

Boas,

Pegando no exemplo do nosso amigo arjames, aqui fica um script de contacto, acabadinho de fazer, um pouco mais elaborado para integrar num site.

Inclui verificação de campos obrigatórios.
Envio de dados por AJAX (sem necessidade de recarregar a página), avisos em tempo real via javascript com mensagem em div.
Retorno de resultado do envio de email.
Envio de Email com a mensagem e respectivos dados via PHP através de servidor SMTP (configurável).

No fundo não é um script preparado para usar mas sim uma espécie de tutorial. Todas as funções estão devidamente descritas e explicadas em comentários.

Qualquer dúvida, façam o favor de perguntar.

Cumprimentos.
Kangoroo

HTML Básico - Criação de Formulários - Parte 2

helldanger1

GForum VIP

helldanger1

GForum VIP

helldanger1

GForum VIP

helldanger1

GForum VIP

arjames

GF Bronze

helldanger1

GForum VIP

arjames

GF Bronze

maar3amt

Administrator

maar3amt

Administrator

arjames

GF Bronze

maar3amt

Administrator

maar3amt

Administrator

arjames

GF Bronze

maar3amt

Administrator

arjames

GF Bronze

Kangoroo

GF Ouro