在 Html 数据表和 Django 中过滤 Json 数据

Question

我在我的 Django 项目的页面中添加了一个数据表。该表应该显示从 Django Rest Framework API 端点检索到的一些数据。

检索到的数据样本如下所示：

{
    "item": "Someitem",
    "Price": 120,
    "Status": "Free"
},
{
    "item": "SecondItem,
    "Price": 90,
    "Status": "Taken"
},

我想过滤这些记录，以便仅将 Status 设置为 Free 的记录显示在表中，但我真的不知道如何从 Jquery 中做到这一点。

这是我用来加载表格的代码：

$(document).ready(function() {

    var table = $('#mydb').DataTable({
        "serverSide": true,             
        "ajax": "/myapi/?format=datatables",
        "columns": [

            {data: "item",
            {data: "Price"},

        ]
    });
    setInterval( function () {
    table.ajax.reload();
}, 10000 );
});

我尝试添加一个 if 语句来检查 Ajax 调用中的data.Pair，但它给了我一个undefined。有没有其他方法可以做到这一点？任何建议表示赞赏

Answer 1

你可以这样做：

1. 寻找filter 方法。 代码：

   var table = $('#mydb').DataTable({ "serverSide": true, "ajax": "/myapi/?format=datatables", "columns": [ {data: "item", {data: "Price"}, {data:"Status"} ] });

然后像这样过滤：

var filteredData = table
    .column( 2 )
    .data()
    .filter( function ( value, index ) {
        return value == "Free";
    } );

1. 您可以 ajax 到 api 并将过滤后的响应附加到您的数据表构造函数（但是，由于您使用服务器端，我假设您是从服务器端分页，因此您需要更改以下代码以使用它）

代码：

$.ajax({ url: "/myapi/?format=datatables", type: 'GET', dataType: 'JSON' }) .done((response)=>{ if(response != undefined){ let data = response.data, filtered_data = []; $.each(data,function(index,value){ if(value.Status == "Free"){ filtered_data.push({ "item": "Someitem", "Price": 120 }); } })//end each //fill the table var table = $('#mydb').DataTable({ "serverSide": true, "data": filtered_data, "columns": [ {data: "item", {data: "Price"} ] }); } })

编辑： 在做了一个 jsfiddle 之后，我意识到我错过了第一个选项的删除方法，所以这里是修复：

 var filteredData =  table
    .rows()
    .indexes()
    .filter( function ( index, value ) {
    console.log(table.row(value).data().Status);
       return table.row(value).data().Status == "Taken"; 
    } );
table.rows( filteredData )
.remove()
.draw();

jsfiddle

希望对你有帮助 =)