1

Olá,

Estou tentando entender chamadas via JS a partir de um formulário (assim que fala?), mas estou com alguns probleminhas e gostaria de uma ajuda.

Meu formuluário é:

Nome: <input type="text" name="name">
E-mail: <input type="email" name="email">
CPF: <input type="number" name="cpf">
Meio de Pagamento: <input type="text" name="pagamento">
<input type="submit" value="Enviar">

E uma parte do código JS que vai tratar as informações:

   enviar.compra({                                 
            name: 'Nome Completo',
            email: '[email protected]',
            data: {                                     
                cpf: 'CPF',                  
                pagamento: 'Cartão VISA'      
            }
   });

Gostaria que as respostas do formulário fossem parar ali nos campos 'Nome Completo' e os outros.

Como fazer isso, e como chamo o js no formulário?

2
  • Sua pergunta não ficou clara, qual o seu problema? O que você quer fazer? Os códigos colocados não fazem sentido pra mim.
    – user13603
    Commented 26/07/2017 às 2:30
  • Pergunta editada @FernandoBagno
    – user78243
    Commented 26/07/2017 às 4:07

2 Respostas 2

1

Imagino que você esteja querendo fazer o seguinte:

  <input type="text" id="name" placeholder="Nome">
  <input type="email" id="email" placeholder="Email">
  <input type="number" id="cpf" placeholder="CPF">
  <input type="text" id="pagamento" placeholder="Pagamento">
  <input onclick="enviarCompra()" type="submit" id="Enviar" placeholder="Enviar">

Pegar os valores digitados nos campos:

function enviarCompra(){
var name = document.getElementById('name').value;
var email = document.getElementById('email').value;
var cpf = document.getElementById('cpf').value;
var pagamento = document.getElementById('pagamento').value;
};

Para conferir adicione a linha na função enviarCompra():

console.log(name);

E confere se o console está reconhecendo a variável da forma como você desejar.

1

Para fazer isso você precisa setar uma função para ser chamada quando enviar o formulário no action e atribuir um id/class para cada elemento, isso vai facilitar a seleção no JavaScript. Depois basta pegar o valor dos inputs, usando o .value, segue código exemplo:

HTML:

<form action="javascript: enviar();">
    Nome: <input type="text" class="js-input-name" name="name">
    E-mail: <input type="email" class="js-input-email" name="email">
    CPF: <input type="number" class="js-input-cpf" name="cpf">
    Meio de Pagamento: <input type="text" class="js-input-pagamento" name="pagamento">
    <input type="submit" value="Enviar">
</form>

JavaScript:

function enviar(){
    //Variaveis que recebem valor dos inputs e depois são atribuidas ao JSON
    var nomeValue = document.querySelector(".js-input-name").value;
    var emailValue = document.querySelector(".js-input-email").value;
    var cpfValue = document.querySelector(".js-input-cpf").value;
    var pagamentoValue = document.querySelector(".js-input-pagamento").value;

    var formValue = {                                 
        name: nomeValue,
        email: emailValue,
        data: {                                     
            cpf: cpfValue,                  
            pagamento: pagamentoValue      
        }
    };
    console.log(formValue);
}

Agora o objeto formValue esta preenchido com todas as informações do formulario!

3
  • Pow mano, manda por aqui mesmo, seria mais difícil para mim te atender pelo e-mail. Commented 26/07/2017 às 3:43
  • Pergunta alterada. Acho que ficou mais claro agora.
    – user78243
    Commented 26/07/2017 às 4:00
  • Eu creio que se encaixa da mesma forma, coloque o formulário onde você comentou, e dentro do identify faça como diz no objeto JSON Commented 26/07/2017 às 14:01

Você deve fazer log-in para responder a esta pergunta.