Pegar dados de formulário HTML
Olá, galera!
Estou aqui com uma dúvida que acho que é bastante simples (não pra mim rsrs).
Tenho um form HTML com alguns campos e, ao clicar no botão submit, preciso pegar os dados dos campos e montar um string. Tipo assim:
Existe uma forma de, sei lá, percorrer o formulário e pegar esses valores, identificando a que campo cada um se refere? Quero dizer: pegar o valo de um input e saber que ele é o do Nome ou Telefone, para montar o string.
Grata.
Estou aqui com uma dúvida que acho que é bastante simples (não pra mim rsrs).
Tenho um form HTML com alguns campos e, ao clicar no botão submit, preciso pegar os dados dos campos e montar um string. Tipo assim:
Nome: nome da pessoa; Telefone: telefone da pessoa; Email: email da pessoa;
Existe uma forma de, sei lá, percorrer o formulário e pegar esses valores, identificando a que campo cada um se refere? Quero dizer: pegar o valo de um input e saber que ele é o do Nome ou Telefone, para montar o string.
Grata.
Carla Batista
Curtidas 0
Respostas
Joel Rodrigues
29/01/2013
Oi, Carla, tudo bem?
Você poderia mostrar o código do seu formulário? Assim fica mais fácil pra tentar te ajudar.
Você poderia mostrar o código do seu formulário? Assim fica mais fácil pra tentar te ajudar.
GOSTEI 0
Danilo Gomes
29/01/2013
Não sei se ajuda, mas você poderia fazer isso atribuindo um "id" aos campos e utilizando document.getElementById(id).value em javascript.
GOSTEI 0
Carla Batista
29/01/2013
Oi, obrigada pelas respostas. Meu form tá assim:
No caso, ao clicar no submit, queria montar um string com os dados dos três campos.
Obrigada mais uma vez.
<form> Nome: <input type="text" id="txtnome"/> <br/> Telefone: <input type="text" id="txttelefone"/> <br/> Email: <input type="text" id="txtemail"/> <br/> <input type="submit" value="enviar"/> </form>
No caso, ao clicar no submit, queria montar um string com os dados dos três campos.
Obrigada mais uma vez.
GOSTEI 0
Danilo Gomes
29/01/2013
Você pode fazer uma função em JS que pegue esses valores.
E seu form pode ter um evento onsubmit que pegue o retorno dessa função.
Se for true, ele faz o submit, senão, não faz.
Isso pode ficar:
function enviar(){
var nome = document.getElementById("txtnome");
var telefone = document.getElementById("txttelefone");
var email = document.getElementById("txtemail");
var texto = nome + telefone + email; // como quiser formatar
return true;
}
E seu form pode ter um evento onsubmit que pegue o retorno dessa função.
Se for true, ele faz o submit, senão, não faz.
Isso pode ficar:
<form onsubmit="return enviar();">
GOSTEI 0
Joel Rodrigues
29/01/2013
Só complementando o código do amigo, é preciso pegar a propriedade value de cada campo. Depois você monta a string conforme o exemplo.
GOSTEI 0
Joel Rodrigues
29/01/2013
Então o código acima ficaria assim:
Teste e nos dê um retorno. Boa sorte.
function enviar(){
var nome = document.getElementById("txtnome").value;
var telefone = document.getElementById("txttelefone").value;
var email = document.getElementById("txtemail").value;
var texto = "Nome: " +nome + "; Telefone: "+ telefone + "; Email: "+email; // como quiser formatar
return true;
}
Teste e nos dê um retorno. Boa sorte.
GOSTEI 0
Carla Batista
29/01/2013
Obrigada, gente. Deu certo. Era isso mesmo que eu queria.
Agora sem querer abusar, se o meu form for crescendo, eu vou ter de fazer pra todos os campos, né?
Tudo bem que não dá muito trabalho, mas teria uma forma de fazer algo mais genérico?
Grata.
Agora sem querer abusar, se o meu form for crescendo, eu vou ter de fazer pra todos os campos, né?
Tudo bem que não dá muito trabalho, mas teria uma forma de fazer algo mais genérico?
Grata.
GOSTEI 0
Danilo Gomes
29/01/2013
Você pode usar o getElementsByTagName (atente-se ao "S" em "Elements")
https://developer.mozilla.org/en-US/docs/DOM/element.getElementsByTagName
Vai te retornar uma coleção de elementos se fizer document.getElementsByTagName('input').
Para cada elemento, pode acrescentar um atributo "alt" que descreva aquele campo (em seu formulário).
Poderia fazer algo similar a (se tiver algo errado, corrijam):
Uma alternativa é conhecer o jQuery, que facilitaria bastante esse trabalho.
https://developer.mozilla.org/en-US/docs/DOM/element.getElementsByTagName
Vai te retornar uma coleção de elementos se fizer document.getElementsByTagName('input').
Para cada elemento, pode acrescentar um atributo "alt" que descreva aquele campo (em seu formulário).
Poderia fazer algo similar a (se tiver algo errado, corrijam):
for (i=0; i<itens.length; i++){
itens[i].getAttribute("alt") + ": " + itens[i].getAttribute("value");
}
Uma alternativa é conhecer o jQuery, que facilitaria bastante esse trabalho.
GOSTEI 0
Carla Batista
29/01/2013
Muito obrigada pela resposta, Midas. No caso esse "itens", eu pegaria usando a função getElementsByTagName que você citou?
Seria assim:
E depois fazer esse for?
Seria assim:
itens = getElementsByTagName(input);
E depois fazer esse for?
GOSTEI 0
Danilo Gomes
29/01/2013
Isso mesmo, ele quem vai te retornar os itens correspondentes a uma tag específica, no seu caso, input
GOSTEI 0
Carla Batista
29/01/2013
Ah, agora sim. Deu certo, Midas. Muitíssimo obrigado.
Podem encerrar este tópico, por favor.
Podem encerrar este tópico, por favor.
GOSTEI 0
Joel Rodrigues
29/01/2013
Obrigado pelo retorno, Carla. E obrigado ao amigo Midas.
Nesse caso estou encerrando o tópico.
Nesse caso estou encerrando o tópico.
GOSTEI 0