数据表显示来自 API 的列表值编号，选择条目10,25在单击时不起作用

编程问答 2022-05-28

问题描述

在每页上显示条目不起作用。 我从 API 请求中获取了股票市场的数据。我的所有数据都成功获取，但是当我将数据设置到 jquery 数据表中时，数据插入成功，但在每页上显示条目，例如：- 10,25,100 不起作用。条目页面默认设置为与从网站获取时相同，不会更改。请帮助我正确工作。

index.PHP


    <html>
    <head>
    </head>
    <body>
    <table class="table table-striped  stocklist">
    <thead>
    <tr>
        <th>Symbol</th>
        <th>Date</th>
        <th>open</th>
        <th>High</th>
        <th>Low</th>
        <th>Close</th>
        <th>Volume</th>
      </tr>
     </thead>   
    
    <?PHP
    include('header.PHP');
    
    $queryString = http_build_query([ 
        'access_key' => '*********','symbols' => 'AAPL'
      ]);
    
      // API URL with query string 
    $apiURL = sprintf('%s?%s','http://api.marketstack.com/v1/eod',$queryString); 
     
    // Initialize cURL 
    $ch = curl_init(); 
     
    // Set URL and other appropriate options 
    curl_setopt($ch,CURLOPT_URL,$apiURL); 
    curl_setopt($ch,CURLOPT_RETURNTRANSFER,true); 
     
    // Execute and get response from API 
    $api_response = curl_exec($ch); 
     
    // Close cURL 
    curl_close($ch);
    
    $api_result = json_decode($api_response,true); 
     
    // Output of the API data 
    // print_r($api_result);
    foreach ($api_result['data'] as $key=>$data)
    { 
      ?>
      <tbody>
      <tr>
         <td><?PHP echo $data['symbol'] ?></td>
         <td><?PHP echo $data['date'] ?></td>
         <td><?PHP echo $data['open'] ?></td>
         <td><?PHP echo $data['high'] ?></td>
         <td><?PHP echo $data['low'] ?></td>
         <td><?PHP echo $data['close'] ?></td>
         <td><?PHP echo $data['volume'] ?></td>
     </tr>
     </tbody>
    
    <?PHP  }?>
    
    </table>
    </body>
    </html>
    
    
    
    <script>
      $(document).ready(function(){
        $('.stocklist').DataTable({
          ordering: false,searching: false
        });
      });  
    </script>

header.PHP


    <html>
    <head>
    <Meta charset="UTF-8">
        <Meta name="viewport" content="width=device-width,initial-scale=1.0">
        <Meta http-equiv="X-UA-Compatible" content="ie=edge">
    <link rel="stylesheet" href="http://localhost/dsr/css/bootstrap.min.css">
    
    <link rel="stylesheet" href="http://localhost/dsr/css/style.css">
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.5.0/css/bootstrap.min.css">
    
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
    
      <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
      <script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.5.0/js/bootstrap.min.js"></script>
    
      <link rel="stylesheet" type="text/css" href="//cdn.datatables.net/1.10.23/css/jquery.dataTables.min.css"/>
     
     <script type="text/javascript" src="//cdn.datatables.net/1.10.23/js/jquery.dataTables.min.js"></script>
     
    
      <!-- <script type="text/javascript" src="https://cdn.datatables.net/1.10.21/js/dataTables.bootstrap4.min.js">  </script> -->
    
    </head>
    </html>

解决方法

暂无找到可以解决该程序问题的有效方法，小编努力寻找整理中！

如果你已经找到好的解决方法，欢迎将解决方案带上本链接一起发送给小编。

小编邮箱:dio#foxmail.com (将#修改为@）

apiapidatatabledatatabledatatablesjavascriptjquery