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

【问题标题】：posting an Json object in an object using ajax使用 ajax 在对象中发布 Json 对象
【发布时间】：2016-12-29 12:30:41
【问题描述】：

我正在尝试通过此调用将新创建的数据发布到我的 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

我已经尝试创建一个变量并将地址放入其中，但它不起作用。感谢您的帮助

【问题讨论】：

在添加到data 键之前尝试使用JSON.stringify
使用JSON.stringify()
所以不是您传递的任何数据，而是仅保存hello 吗？

标签： javascript json ajax

【解决方案1】：

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

$data = json_encode($_POST);

将数组转换为json字符串

【讨论】：

【解决方案2】：

看到这个答案：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);
    });}

【讨论】：

【解决方案3】：

我想像图片中的顶部一样保存它，但它像底部一样保存，无论如何都在这附近？

您应该指定 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

【讨论】：