DataTables, как правильно вызвать data.json

Question

Мои данные для DataTable в настоящее время расположены в нижней части моего app.js и выглядят примерно так:

var data = {
"things": [
{
"date": {
    "display": "April 15, 2011",
    "date_order": "1"
},
"place": "Chicago, auto parts yard"
]
...
};

Я называю данные в верхней части моего app.js следующим образом:

var table =  $('#table').DataTable({
      "data": data.things,
      "columnDefs": [
        { "type": "num", "targets": 1 },
        { "type": "num", "targets": 3 }
      ],
      "columns": []
...

Я очень внимательно следил за этим , и это работает для меня.

Очевидно, что хранить ваши данные внутри app.js - плохая практика.Но когда я перемещаю свои данные в файл data.json внутри папки data, я не могу это вызвать.Вызов данных затем выглядел бы примерно так:

var table =  $('#table').DataTable({
          "data": "../data.json",
...

, потому что это, похоже, не работает, если я не делаю это ужасно неправильно.Какой будет правильный синтаксис для этого?FWIW, мой app.js находится внутри js/src, а мой data.json находится внутри папки data, которая находится на том же уровне, что и моя папка js.

Answer 1

Используйте параметр ajax для загрузки данных из внешнего источника данных через Ajax.

Если ваша структура каталогов:

/
├── js/
│   └── app.js
└── data/
    └── data.json

Затем используйте код ниже:

var table =  $('#table').DataTable({
      // ... skipped ...
      "ajax": {
         "url": "../data/data.json",
         "dataSrc": "things"
      }
});