javascript - 如何挑选要在 jQuery 数据表中显示的列？

Question

从服务器返回的 JSON(用于填充 dataTable )如下所示:

[
   {
      "id":1,
      "attributeType":{
         "id":1,
         "name":"test1",
         "tag":"test-type",
         "is-dog":false
      },
      "attributeValue":{
         "id":null,
         "name":"blah",
         "tag":"BLAH"
      },
      "buzz":1,
      "fizz":"53abc"
   }
]

但是，我只想显示以下字段:

• id
• attributeValue.name
• 嗡嗡声

此外，我希望它们按以下顺序显示(从左到右):

• 嗡嗡声
• attributeValue.name
• id

如何配置我的数据表以仅选择这三个字段，并以所需的顺序显示它们？提前致谢!

Answer 1

要实现此目标，您可以动态构建表，然后将其发送到数据表。

在下面的示例中，我假设 Json 在 jQuery Ajax 调用中返回，并且您的响应中有多个项目:

$.ajax({
    type: "POST",
    url: "Controller Url",
    contentType: "application/json; charset=utf-8",
    dataType: "json",
...
...
success: function (response) {

// Assuming you need to parse, you may not need to depending on how the data is returned.
var parsedJson = $.parseJSON(response); 
// Empty var to hold the table content.
var buildTable = "";

$.each(parsedJson, function(i)) {
    buildTable += "<tr>";
    buildTable += "<td>" + parsedJson[i].buzz + "</td>";
    buildTable += "<td>" + parsedJson[i].attributeValue.name + "</td>";
    buildTable += "<td>" + parsedJson[i].id + "</td>";
    buildTable += "</tr>";
});

// Now fill your datatable with the table content in the order you want and with only the fields required.
$("#datatableContent").append(buildTable);

// Configure your datatable
$('#datatableContent').dataTable({ });

} //end success

});// end ajax

在您看来，您会:

<table id="datatableContent">
<thead>
    <tr>
        <th>Buzz</th>
        <th>Name</th>
        <th>ID</th>
    </tr>
</thead>
<tbody>
</tbody>

需要记住的一件事是，如果我将 $('#datatableContent').dataTable({ }); 配置部分放置在 ajax 调用成功的情况下，我就会遇到问题。我在成功的 $("#datatableContent").append(buildTable); 行之后放置了地雷，并且每次都完美运行。