javascript 为什么我的jQuery DataTable没有从数组中填充?

6l7fqoea  于 2023-05-05  发布在  Java
关注(0)|答案(1)|浏览(103)

我试图从一个API调用创建一个高尔夫球员的数据表,但我的表只是说“表中没有可用的数据”。我已经调试过了,可以看到数据数组包含正确的信息和格式,并且查看了datatables文档,我不确定我做错了什么。
JavaScript:

let data;
            $.ajax({
                url: "https://pure-peak-65624.herokuapp.com/https://api.sportradar.us/golf/trial/v3/en/players/wgr/2022/rankings.json?api_key=rupvugmcybede53f3svuqqa8",
                dataType: 'json',
                success: function (json) {
                    console.log("success");
                    data = json.players;
                },
                error: function (e) {
                    console.log("error");
                }
            });

            $('#myTable').DataTable({
                data: data,
                columns:[
                    {data: 'id'},
                    {data: 'first_name'}
                ]
            });

        });

Picture of empty DataTable
一开始,我尝试在datatable函数中 AJAX 将数据加载到表中,但当这不起作用时,我将其分解为一个单独的ajax调用,以尝试和调试更容易。

1cklez4t

1cklez4t1#

您可能应该在 AJAX 成功中填充dataTable

let data;
$.ajax({
  url: "https://pure-peak-65624.herokuapp.com/https://api.sportradar.us/golf/trial/v3/en/players/wgr/2022/rankings.json?api_key=rupvugmcybede53f3svuqqa8",
  dataType: 'json',
  success: function(json) {
    console.log("success");
    data = json.players;
    $('#myTable').DataTable({
      data: data,
      columns: [{
          data: 'id'
        },
        {
          data: 'first_name'
        }
      ]

    });
  },
  error: function(e) {
    console.log("error");
  }
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script type="text/javascript" src="https://cdn.datatables.net/1.12.1/js/jquery.dataTables.min.js"></script>
<table id="myTable">
  <thead>
    <tr>
      <th>id</th>
      <th>first name</th>
    </tr>
  </thead>

</table>

相关问题