数据表 - 从AJAX源过滤数据 [英] Datatables - filter data from AJAX source

问题描述

我有一个数据表并从api获取数据。现在我的状态如活动，非活动如果标志处于活动状态，那么我需要在数据表中显示我不应该显示已过期的状态。这是我的小提琴。在这个小提琴我显示活跃和非活动两者。但我想只显示活动状态。

I have a datatable and am fetching the data from an api. Now i have the status like active,inactive if the flag is active then i need to show in the datatble else i should not show the expired one.Here is my fiddle. In this fiddle am showing the active and inactive both. but i want to show only the active status.

HTML

<table id="example" class="display" cellspacing="0" width="100%">
     <thead>
         <tr>
           <th>Name</th>
           <th>Email</th>
           <th>Subject</th>
           <th>Status</th>
           <th>Message</th>
           <th>Details</th>
         </tr>
        </thead>
 </table>

脚本：

$(document).ready(function() {
    $('#example').DataTable({
        "processing" : true,
        "ajax" : {
            "url" : "https://api.myjson.com/bins/12uwp2",
            dataSrc : ''
        },
        "columns" : [ {
            "data" : "name"
        }, {
            "data" : "email"
        }, {
            "data" : "subject"
        }, {
            "data" : "status"
        },{
            "data" : "message"
        },
        {
                "mData": "Details",
                "mRender": function (data, type, row) {
                    return "<a class='delete' data-id=" + row.id + " href='/Details/" + row.id + "'>Delete</a>";
                }
        }]
    });
    $(document).on("click", ".delete", function(e) {
        e.preventDefault()
        alert("Delete button clicked for Row number " + $(this).data("id"))
    })
});

如何做到这一点。任何人都可以帮我怎么做。

How to do this. Can anyone help me how to do.

推荐答案

用例是：操纵从服务器返回的数据

The use case is: Manipulate the data returned from the server

$('#example').DataTable({
    "ajax" : {
        "url" : "https://api.myjson.com/bins/12uwp2",
        "dataSrc": function ( json ) {
            return json.filter(function(item){
                return item.status=="active";         
                });
         }
    }
});

关键是正确使用 dataSrc 数据操作。

The key is to use dataSrc properly for data manipulation.

作为一个函数 - 作为一个函数，它需要一个参数，从服务器返回的JSON
，可以根据需要进行操作。函数的
返回值是DataTables将用作
表的数据源。

As a function - As a function it takes a single parameter, the JSON returned from the server, which can be manipulated as required. The returned value from the function is what will be used by DataTables as the data source for the table.

我建议从DataTable初始化对象中删除处理属性，因为不再有繁重的处理步骤。

I recommend to remove the processing property from DataTable initialization object since there is no heavy processing step anymore.

文档

• 从Ajax源加载表格内容的数据 - 示例


• 实例 - JSFiddle


• 清洁代码示例使用单独的过滤功能 - JSFiddle

• Load data for the table's content from an Ajax source - Examples
• Live Example - JSFiddle
• Clean code example using a separate filter function - JSFiddle

这篇关于数据表 - 从AJAX源过滤数据的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！