0

Olá, estou com problemas para enviar um POST, utilizando Ajax, só que o conteúdo tem que ser nesse formato:

name: 'Nome Candidato',
contents = {
'email': '[email protected],
'formacao': 'superior completo'
}

Ao fazer o POST pelo Postman, ele envia normalmente:

inserir a descrição da imagem aqui

Porém ao fazer pelo HTML, retorna sempre erro 422 na URL.

var vNome = $("#nome").val();
var vEmail = $("#email").val();

var vData = {
    name : vNome
    <<<<<< Não sei o que colocar aqui >>>>>>
};

$.ajax({
    method: "POST",
    url: vUrl,
    data: JSON.stringify(vData)
})
.done(function(msg){
    $("#resultado").html(msg);
})
.fail(function(jqXHR, textStatus, msg){
    alert(jqXHR);
}); 

2 Respostas 2

3

O primeiro erro está aqui:

name: 'Nome Candidato',
contents = {
'email': '[email protected],
'formacao': 'superior completo'
}

Porque, aparentemente, você está tentando enviar um objeto, entretanto, a sintaxe de um objeto, em javascript, não é dessa forma aí (não digo por causa das aspas simples, por mais que dê certo, digo por causa da igualdade após a palavra contentes), mas sim desta, aqui, que é a correta sintaxe:

name: 'Nome Candidato',
contents: {
  email: '[email protected]',
  formacao: 'superior completo'
}

Outra coisa: Ao enviar desta forma data: JSON.stringify(vData), seus dados serão enviados como string, mas não objetos, pois a função stringify converte um objeto para uma string.

Então, para corrigir, estou lhe enviando um código completo e testado, espero que lhe ajude.

index.php:

<!DOCTYPE html>
<html lang="pt-br">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>

</head>

<body>
    <input type="text" id="nome" autofocus>
    <input type="text" id="email">
    <input type="text" id="formacao">
    <button id="enviar">Enviar</button>

    <pre id="resultado"></pre>

    <script src='https://cdnjs.cloudflare.com/ajax/libs/jquery/3.4.1/jquery.min.js'></script>
    <script>
        $(document).ready(function() {

            $("#enviar").click(function() {

                var vNome = $("#nome").val();
                var vEmail = $("#email").val();
                var vFormacao = $("#formacao").val();

                //Um arquivo de servidor em php, somente para teste:
                var vUrl = "teste.php";

                //Sintaxe correta:
                var vData = {
                    name: vNome,
                    contents: {
                        email: vEmail,
                        formacao: vFormacao
                    }
                };

                $.ajax({
                        method: "POST",
                        url: vUrl,
                        data: vData
                    })
                    .done(function(msg) {
                        $("#resultado").html(msg);
                    })
                    .fail(function(jqXHR, textStatus, msg) {
                        alert(jqXHR);
                    });
            });


        })
    </script>
</body>

</html>

teste.php:

<?php
print_r($_POST);

print_r("\n<strong>Chaves:</strong>\n\n");

print_r(array_keys($_POST));

print_r('<h3>Saida:</h3>');

var_dump('name =>'.$_POST['name']);

var_dump('contents[emai] => '.$_POST['contents']['email']);

var_dump('contents[formacao] => '.$_POST['contents']['formacao']);

/*Saída:

Array
(
    [name] => Taffarel
    [contents] => Array
        (
            [email] => Xavier
            [formacao] => sadfads
        )

)

Chaves:

Array
(
    [0] => name
    [1] => contents
)

string(15) "name =>Taffarel"
string(24) "contents[emai] => Xavier"
string(29) "contents[formacao] => sadfads"
*/

Ia esquecendo: a variável vUrl tinha algum valor no seu código?

Print:

inserir a descrição da imagem aqui

REFERÊNCIA:
Ajax Form Data

1
  • 1
    Obrigado pela ajuda Taffarel. Realmente era o JSON.stringify. Obrigado! Commented 20/10/2019 às 22:15
0
var vData = {
    name : vNome,
    contents : {
        e-mail : vEmail,
        formacao : 'Superior completo'
   }
};
3
  • Eu continuo recebendo a mesma informação Danilo. Eu já fiz esse teste, acredito que seja uma variavel (name) e um objeto (contents) Commented 19/10/2019 às 22:24
  • Tenta tirar o JSON.stringify ou alterá-lo para JSON.parse Commented 19/10/2019 às 22:45
  • 1
    @DaniloKörber sua resposta é bem vaga, poderia explicar como ela supostamente responde a pergunta? Commented 19/10/2019 às 23:47

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

Esta não é a resposta que você está procurando? Pesquise outras perguntas com a tag .