DataTables Javascript數據源“無可用數據”

Question

實時錯誤示例： http : //live.datatables.net/virobeci/1/edit?html,css,js,output

我有一個類似於以下內容的JavaScript對象：

{ 
    "rows": [
        {
            "doc": {
                "CustomerName": "abc",
                "key": "value",
                "keyabc": "value"
            }
        },
        {
            "doc": {
                "CustomerName": "abc",
                "key": "value",
                "keyabc": "value"
            }
        }
    ]
}

我已經嘗試了很長時間了，以使DataTables使用JavaScript數據源進行初始化，如下所述：

https://datatables.net/examples/data_sources/js_array.html

這就是我在做什么：

    var table = $('#customersTable').DataTable( {  
        data: view,
        columns: [
            { "rows" : 'doc.CustomerName' },
            { "rows" : 'doc.CustomerName' },
            { "rows" : 'doc.CustomerName' },
            { "rows" : 'doc.CustomerName' },
            { "rows" : 'doc.CustomerName' },
            { "rows" : 'doc.CustomerName' }
        ]  
    }); 

我沒有錯誤，只是“表中沒有可用數據”

表的定義如下：

    <table id="customersTable" class="table table-striped table-bordered" width="100%">
        <thead>
            <tr>
                <th>Name</th>
                <th>Number</th>
                <th>Login</th>
                <th>Party</th>
                <th>Sales-Id</th>
                <th>Sales-Party</th>
            </tr>
        </thead>
        <tfoot>
            <tr>
                <th>Name</th>
                <th>Number</th>
                <th>Login</th>
                <th>Party</th>
                <th>Sales-Id</th>
                <th>Sales-Party</th>
            </tr>
        </tfoot>

    </table>

實時示例： http : //live.datatables.net/virobeci/1/edit?html,css,js,output

編輯->請注意：

除了運行for循環並創建新數組以匹配示例數據源外，我無法更改數據源的格式。 我想知道是否可以使用這種類型的數據源初始化表

Answer 1

您的數據格式不正確：

var view = { 
"rows": [
    {
            "CustomerName": "abc",
            "key": "value",
            "keyabc": "value"
    },
    {
            "CustomerName": "abc",
            "key": "value",
            "keyabc": "value"
    },
  {
            "CustomerName": "abc",
            "key": "value",
            "keyabc": "value"
    }
]
};

而且，您必須將正確的數組分配為data.row（盡管在這種情況下，您可以簡化結構，只刪除一個級別）。

請注意，您必須將數據添加到“列”的“數據”屬性中：

var table = $('#customersTable').DataTable( { 
        processing: true,
        data: view.rows, 
        columns : [
            { data : 'CustomerName' },
            { data : 'CustomerName' },
            { data : 'CustomerName' },
            { data : 'CustomerName' },
            { data : 'CustomerName' },
            { data : 'CustomerName' }
        ]  
 }); 

Answer 2

您必須在“列”配置中提及列名稱，然后您的數據就可以變平。

http://live.datatables.net/poganaso/2/edit

Answer 3

您可以嘗試一下，示例代碼在這里： http : //live.datatables.net/virobeci/2/edit?html,css,js,output