如何使用本地 JSON 对象作为 jQuery DataTables 的数据源 [英] How can I use a local JSON object as a data source for jQuery DataTables

问题描述

我有一个格式如下的本地 JSON 对象:

I have a local JSON object formatted like this:

[{
    "id": "58",
    "country_code": "UK",
    "title": "Legal Director",
    "pubdate": "2012-03-08 00:00:00",
    "url": "http://..."
},{
    "id": "59",
    "country_code": "UK",
    "title": "Solutions Architect,",
    "pubdate": "2012-02-23 00:00:00",
    "url": "http://..."
},{
    // ....more of the same......
}]

我想将此设置为 jQuery datatable 的数据源，并尝试过:

I would like to set this as the data source for a jQuery datatable and have tried this:

testdata = '{{ jobsJSON | raw }}'; //twig template tag
console.log(testdata);
$('#test').dataTable({
    "aoData": testdata,
    "aoColumns": [
        { "mDataProp": "id" },
        { "mDataProp": "country_code" },
        { "mDataProp": "title" },
        { "mDataProp": "pubdate" },
        { "mDataProp": "url" }
    ]
});

DataTables 插件加载并尝试绘制表格，但给出错误表格​​中无可用数据"

The DataTables plugin loads and attempts to draw the table but gives the error 'No data available in table'

我不是在进行 AJAX 调用，只是想从本地 JS 变量访问 JSON 对象.

I am not making an AJAX call and just want to access the JSON object from a local JS variable.

推荐答案

提供自己数据的属性是 aaData NOT aoData:

The property to supply your own data is aaData NOT aoData:

testdata = [{"id":"58",...}]; // local object

$('#test').dataTable({
    "aaData": testdata,
    "aoColumns": [
        { "mDataProp": "id" },
        { "mDataProp": "country_code" },
        { "mDataProp": "title" },
        { "mDataProp": "pubdate" },
        { "mDataProp": "url" }
    ]
});

工作小提琴

这篇关于如何使用本地 JSON 对象作为 jQuery DataTables 的数据源的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！