Как я могу использовать локальный объект JSON в качестве источника данных для jQuery DataTables - PullRequest
20 голосов
/ 12 марта 2012

У меня есть локальный объект JSON, отформатированный следующим образом:

[{
    "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 и пробовал это:

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 загружает и пытается нарисовать таблицу, но выдает ошибку «Нет данных в таблице»

Я не делаю вызов AJAX и просто хочу получить доступ к объекту JSON излокальная переменная JS.

Ответы [ 2 ]

41 голосов
/ 12 марта 2012

Свойство для предоставления ваших собственных данных: aaData НЕ aoData:

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

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

Рабочая скрипка

1 голос
/ 11 августа 2012

Я столкнулся с той же проблемой, решение выглядит следующим образом: Поместите код $('#list_table').dataTable в функцию setTimeout, чтобы отложить приложение dataTable на 5 секунд:

setTimeout("$('#list_table').dataTable ...." , 5000);

Я заметил, что применение плагина dataTable в firebug послетаблица загружена, ошибка не отображается как «Нет данных в таблице».

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...