Как проверить, вернул ли Ajax-вызов для jQuery DataTable данные - PullRequest
1 голос
/ 10 октября 2019

Я пытаюсь загрузить jQuery DataTable из вызова AJAX, как показано в коде ниже. Однако мне нужно знать, существует ли обратный вызов для DataTable, чтобы проверить, успешно ли завершился вызов AJAX до загрузки таблицы.

$(function() {
  $('#data-table').DataTable({
    destroy: true,
    responsive: true,
    serverSide: false,
    autoWidth: false,
    paging: true,
    filter: true,
    searching: true,
    stateSave: true,
    scrollX: true,
    lengthMenu: [5, 10, 25, 50, 75, 100],
    ajax: {
      url: 'https://jsonplaceholder.typicode.com/todos',
      type: 'GET',
      dataSrc: ''
    },
    columns: [{
      title: 'Zone',
      data: 'LastKnownZone',
    }, {
      title: 'Hiérarchie Map',
      data: 'MapInfo.mapHierarchyString',
    }, {
      title: 'Addresse MAC',
      data: 'macAddress',
    }],
    initComplete: function(json) {
      let returned_data = json;
      //..Do something with data returned
    }
  });
});

Оцените любую помощь.

Ответы [ 2 ]

1 голос
/ 11 октября 2019

Просто добавив что-то к ответу @Fawaz Ibrahim, также лучше добавить опцию error в вызове Ajax, чтобы проверить, нет ли у вас какой-либо ошибки или проблемы, потому что в случае ошибки обратный вызов dataSrc не будет запущен, поэтому вы выигралинет успешных возвращенных данных.

ajax: {
  ...
  dataSrc: function ( receivedData ) {
    console.log('The data has arrived'); // Here you can know that the data has been received
    return receivedData;
  },  
 error: function (xhr, error, thrown) {
     console.log('here you can track the error');
  }
}
1 голос
/ 10 октября 2019

Как упоминается на их официальном сайте:

Для полноты нашего обсуждения загрузки Ajax стоит отметить, что в настоящее время DataTables, к сожалению, не поддерживает настройку через Ajax. Это то, что будет рассмотрено в будущем

Но вы можете использовать идею datasrc, например:

$(function() {
  $('#data-table').DataTable({
    ...
    ajax: {
      ...
      dataSrc: function ( receivedData ) {
        console.log('The data has arrived'); // Here you can know that the data has been received
        return receivedData;
      }
    },
    ...
  });
});
...