使用ajax在对象中发布Json对象

时间:2016-12-29 12:30:42

标签: javascript json ajax

我试图通过此调用将新创建的数据发布到我的json数据库

function sendtovenaarData(url){
$.ajax({

    url: "http://localhost:3000/" + url,
    type: 'POST',
    data:
    {
        voornaam:  $("#voornaam").val(),
        achternaam:  $("#achternaam").val(),
        beroep: $("#beroep").val(),
        adres:{
            streetAddress: $("#streetAddress").val(),
            city: $("#city").val(),
            state: $("#state").val(),
            zip: $("#zip").val()
        },
        haardplaats: $("#haardplaats").val(),
        favoriete_quote: $("#favoriete_quote").val()
    }

}).done(function () {

    console.log("data added");
    location.reload();

}).fail(function (xhr, message, error) {
    console.log(xhr, message, error);
});}

我希望将其保存为图片中的顶部,但它会像底部那样保存,但是这周围有吗? image of saved json

我已经尝试过创建一个变量并将adres放在那里,但它不起作用。谢谢你的帮助

3 个答案:

答案 0 :(得分:0)

显示您的服务器代码。如果您使用PHP,那么您可以尝试

$data = json_encode($_POST);

将数组转换为json字符串

答案 1 :(得分:0)

请参阅此答案:https://stackoverflow.com/a/5571112/3432422

data参数应该是一个字符串化的对象,如下所示:

function sendtovenaarData(url){
    $.ajax({
        url: "http://localhost:3000/" + url,
        type: 'POST',
        data: JSON.stringify(
        {
            voornaam:  $("#voornaam").val(),
            achternaam:  $("#achternaam").val(),
            beroep: $("#beroep").val(),
            adres:{
                streetAddress: $("#streetAddress").val(),
                city: $("#city").val(),
                state: $("#state").val(),
                zip: $("#zip").val()
            },
            haardplaats: $("#haardplaats").val(),
            favoriete_quote: $("#favoriete_quote").val()
        })
    }).done(function () {
        console.log("data added");
        location.reload();
    }).fail(function (xhr, message, error) {
        console.log(xhr, message, error);
    });}

答案 2 :(得分:0)

  

我希望将其保存为图片中的顶部,但它会像底部那样保存,但是这周围有吗?

您应该指定Ajax标头,例如:

$.ajaxSetup({
 dataType: 'json',
 contentType: 'application/json; charset=utf-8'
});

之后,每个ajax调用都将使用特定于JSON的标头发送。 要发送数据,您应该执行以下操作:

$.ajax({

    url: "http://localhost:3000/" + url,
    type: 'POST',
    data:
    JSON.stringify({
        voornaam:  $("#voornaam").val(),
        achternaam:  $("#achternaam").val(),
        beroep: $("#beroep").val(),
        adres:{
            streetAddress: $("#streetAddress").val(),
            city: $("#city").val(),
            state: $("#state").val(),
            zip: $("#zip").val()
        },
        haardplaats: $("#haardplaats").val(),
        favoriete_quote: $("#favoriete_quote").val()
    })

}).done(function () {

    console.log("data added");
    location.reload();

}).fail(function (xhr, message, error) {
    console.log(xhr, message, error);
});}

如果您在后端使用PHP,那将是不够的,因为PHP无法使用JSON后期数据,并且您的$ _POST将为空,但如果您正在使用其他内容(java with spring,node js ...等)它应该正确地解析数据。如果是php,请查看此处 - PHP: file_get_contents('php://input') returning string for JSON message