Question

我有一个ajax查询，它返回一些JSON并将其放入表中。 JSON采用以下格式：

[
  {
    "firstname": "Donald",
    "lastname": "Duck",
    "email": "quack@gmail.com",
    "skills": [
      {
        "id": 1,
        "name": "maths"
      },
      {
        "id": 2,
        "name": "chemistry"
      }
    ]
  }

技能＆＃39;作为对象返回，因为它们有多个值，但这意味着它们不会显示在我的表中。我曾尝试使用

将它们转换为字符串

JSON.Stringify（data [i] .skills，null，＆＃34;＆＃34;）但它使整个表格消失。关于如何将数据显示在表格中的任何想法？

这是我的功能 -

function getAgents() {


     $.ajax({
         type: "GET",
         url: "http://127.0.0.1:3010/admin-api/v1/123/agents/",
         contentType: "application/json; charset=utf-8",
         crossDomain: true,
         dataType: "json",
         success: function (data, status, jqXHR) {

             // fill a table with the JSON
           $("table.mytable").html("<tr><th></th><th>First Name</th><th>Last Name</th>  <th>Queues</th></tr>"  );

for (var i=0;i<data.length;i++) {
   $("table.mytable").append("<tr><td>" + "<input type = 'checkbox'" + "</td><td>" + data[i].firstname + "</td><td>" + data[i].lastname + "</td><td>" + data[i].skills +  "</td></tr>"  );
}

         },

         error: function (jqXHR, status) {
             // error handler
             console.log(jqXHR);
             alert('fail' + status.code);
         }
      });
   }

也尝试了 -

$("table.mytable").html("<tr><th></th><th>First Name</th><th>Last Name</th><th>Queues</th></tr>"  );

              for (var i = 0; i < data.length; i++) {
                var skills = data[i].skills;

                  for(var j = 0; j < skills.length; j++) {
                  var skill = skills[j];



    $("table.mytable").append("<tr><td>" + "<input type = 'checkbox'" + "</td><td>" + data[i].firstname + "</td><td>" + data[i].lastname + "</td><td>" + data[i].skill + "</td></tr>");
}
}

         },

Answer 1

您正在使用JSON.Stringify;它应该是JSON.stringify。你检查控制台是否有错误？但是，简单地将JSON吐出并不是太用户友好。这就是你想要的吗？

您将不得不迭代每个技能，然后以您认为合适的格式将其插入表中（也许您可以使用无序列表）：

var $table = jQuery("table");
$table.append(jQuery("tr")
    .append(
        jQuery("th").text("First Name"))
    .append(
        jQuery("th").text("LastName")) ... //and so on 
)

for(var i = 0; i < data.length; i++) {
    var $tr = jQuery("tr");
    $tr.append(
        jQuery("td").text(data[i].firstname})
    ).append(
        jQuery("td").text(data[i].lastname)
    )...

    var skills = data[i].skills;
    var $ul = jQuery("ul");

    for(var j = 0; j < skills.length; j++) {
        var skill = skills[j];

        $ul.append(jQuery("li").text(skill.name));
    }

    $tr.append(jQuery("td").append($ul));
}

格式化JSON对象以在表中显示

1 个答案: