Пустое тело таблицы в jQuery DataTables - PullRequest
Новая
       3

Пустое тело таблицы в jQuery DataTables

0 голосов
/ 12 февраля 2019

Я новичок в jQuery, поэтому, пожалуйста, не судите меня за мой тупой вопрос.То, чего я пытаюсь добиться, - это заполнить данные данными по обменным курсам, источником которых является API .

Итак, мне удалось создать таблицу данных, но ее тело пусто, и в нем нет ошибок.консоль, это просто сообщение " loading ... ", где мои данные должны быть.

Поиск похожих тем просто не дал результатов.Я был бы благодарен за вашу помощь, потому что я уже 2 дня бьюсь головой об стену. 

<head> 
  <script src="https://code.jquery.com/jquery-3.3.1.min.js"></script> 
  <script src="https://cdn.datatables.net/1.10.19/js/jquery.dataTables.min.js"></script>       
  <link rel="stylesheet" type="text/css" href="https://cdn.datatables.net/1.10.19/css/jquery.dataTables.min.css"> 
</head> 
<body> 
  <table id="rates"></table> 
</body>

var key = '8366e7a49e014c729111a0ac6e5c7d9d';
var url = 'https://openexchangerates.org/api/latest.json?app_id=';
var dataTable = $('#rates').DataTable({
  sDom: 't',
  ajax: {
    url: url + key
  },
  columns: [{
    title: 'currency'
  },{
    title: 'rate'
  }]
});

1 Ответ

0 голосов
/ 12 февраля 2019

Похоже, что ваши данные структурированы неправильно.Каждая запись данных должна соответствовать строке DataTables, поэтому ваш код должен выглядеть примерно так: 

var key = '8366e7a49e014c729111a0ac6e5c7d9d';
var url = 'https://openexchangerates.org/api/latest.json?app_id=';

var dataTable = $('#rates').DataTable({
  sDom: 't',
  ajax: {
    url: url+key,
    dataSrc: function(data){
        let apiData = [];
        $.each(data.rates, function(index, entry){
          apiData.push({currency:index, rate:entry});
        });
        return apiData.slice(0,10);
      }
    },
    columns: [
      {title:'currency', data:'currency'},
      {title:'rate', data:'rate'}
    ]
});
<!doctype html>
<html>
<head>
  <script src="https://code.jquery.com/jquery-3.3.1.min.js"></script>
  <script src="https://cdn.datatables.net/1.10.19/js/jquery.dataTables.min.js"></script>
  <link rel="stylesheet" type="text/css" href="https://cdn.datatables.net/1.10.19/css/jquery.dataTables.min.css">
</head>
<body>
  <table id="rates"></table>
</body>
</html>
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.

Нет похожих вопросов

...