Pedido `{Djo}
Leituras recomendadas.
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 obrigatoria)
action: aqui será o nome ou a url, do arquivo que irá “pegar” os dados digitados no formulario.
A tag <input> é um campo para entrada de dados, essa tag não precisa ser fechada(não existe </input>).
<input name=”titulo”>
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” />
password: campo de tipo senha, ao digitar algum valor os caracteres são escondidos por asteriscos<input name=”titulo” value=”texto” type=”password” />
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
Item 1<input name=”titulo” value=”futebol” type=”checkbox”>Item 1
<input name=”titulo” value=”volei” type=”checkbox” checked=”checked”>Item 2, Checado
radio: botão de unica escolha, desde que todos tenham o mesmoname, 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
Item 1<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
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” >
<input type=”submit” value=”texto” >
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
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 o 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.
[code="html"]
0 comentários:
Postar um comentário