2017-01-30 4 views
0

У меня есть таблица HTML, который генерируется в следующем составе:Dynamic HTML таблицы с DataTable не постраничного

echo "<table class='table table-striped table-inverse table-bordered table-hover' id='LeaderBoardTable' table_Dynamic >"; 
echo "<thead>"; 
echo "<tr>"; 
echo "<th></th>"; 
echo "<th>Username</th>"; 
echo "<th>SteamID</th>"; 
echo "<th>Score</th>"; 
echo "<th>K/D</th>"; 
//echo "<th>Search</th>"; //Do later 
echo "</tr>"; 
echo "</thead>"; 
echo "<tbody id='leaderboardTable' class='leaderboardTable'>"; 
foreach ($items as $item){ 
    $player = new Player($item['steam'], $dbh); 
    echo "<tr>"; 
    echo "<td><i class='fa fa-crosshairs' aria-hidden='true'></i></td>"; 
    echo "<td>" . $player->get("name") . "</td>"; 
    echo "<td>" . $player->get("steam") . "</td>"; 
    echo "<td>" . $player->get("score") . "</td>"; 
    echo "<td>" . getKD($player) . "</td>"; 
    echo "</tr>"; 
} 
echo "</tbody>\n</table>"; 

В таблице нагрузки штраф и JavaScript, чтобы вставить его в документ выглядит следующим образом:

$(document).ready(function() { 
    $.ajax({ 
     type: 'post', 
     url: 'control/leaderboard/leaderboardGrab.php', 
     data: 'null=null', 
    }).done(function(d){ 
     $('#loadArea').html(d); 
     $('#LeaderBoardTable').DataTable({ 
      "order": [[3, "desc"]], 
      "bPaginate": true, 
     }); 
    }); 

}); 

Таблица сама загружается штрафом, а функция .DataTable() «работает», так как в таблице есть стрелки рядом с ней для сортировки, и окно поиска и количество отображаемых элементов все там и работают отлично, но разбиение на страницы, похоже, не работает хотя он d показывает правильное количество страниц. В настоящее время он показывает [1] [2] [3] [4] [5] [...] [307], поэтому он имеет нужное количество страниц, но я не могу нажать ни на один из чисел, чтобы перейти к этому стр. Ниже приведена полная страница, называя код генерации, а также все вызовы файлов в голове.

<html> 
<head> 
    <title> <?php echo $webTitle; ?> </title> 
    <?php $page = "leaderboards" //setting page for include ?> 
    <meta charset="UTF-8"> 
    <meta name="viewport" content="width=device-width, initial-scale=1"> 
    <!-- Calling JS --> 
    <!-- Latest compiled and minified Jquery JavaScript --> 
    <script src="js/jquery.min.js"></script> 
    <script src="js/DataTable/jqueryDataTables.js"></script> 
    <script src="js/DataTable/dataTables.bootstrap4.min.js"></script> 
    <script src="js/bootstrap/bootstrap.min.js"></script> 
    <script src="js/leaderboard/leaderboardFunctions.js"></script> 
    <!-- Bootstrap 4 and Tether --> 
    <script src="js/tether/tether.min.js"></script> 

    <!-- Custom JS --> 
    <script src="js/Navjs.js"></script> 
    <script src="js/paging.js"></script> 

    <!-- End Of JS --> 

    <!-- Bootstrap 4, Tether, Fontawesome --> 
    <link rel="stylesheet" href="css/DataTable/dataTables.bootstrap4.css"> 
    <link rel="stylesheet" href="css/tether/tether.min.css"> 
    <link rel="stylesheet" href="css/bootstrap/bootstrap.min.css"> 
    <link rel="stylesheet" href="css/fontawesome/font-awesome.min.css"> 
    <link rel="stylesheet" href="css/social.css"> 
    <!-- Custom CSS --> 
    <link rel="stylesheet" href="css/style.css"> 
</head> 
<body> 
<?php include_once "views/social.php" ?> 
<div class="container" style="width:95%;"> 
    <div class="row"> 
     <div class="wrapper"> 
      <?php include_once "views/nav/index.php" ?> 

      <?php include_once "views/$page/index.php" ?> 
     </div> 
    </div> 
</div> 

</body> 
</html> 

Любые идеи, почему это не работает? 90% DataTables работает, но разбиение на страницы не работает, и это кажется единственной частью, которая не работает.

Ошибка только в консоли. Мне не хватает Favicon.ico.

Спасибо!

+0

Ошибки, связанные с DataTables, ошибки были включены сейчас в нижней части моего сообщения. Также я могу сделать скрипку, но я не могу сделать динамический контент? Я не уверен, что статический контент будет работать, но весь контент, который я использую для этого сайта, динамически генерируется на основе данных в базе данных. – AndyPet74

+0

Исправлены все ошибки консоли, но отсутствующий значок и ошибка все еще случаются, это также Bootstrap 4. – AndyPet74

ответ

0

Сделал некоторые изменения, в которые я включил файлы, я пробовал с CDN, и он работал в основном за исключением некоторого стиля, поэтому я загрузил те же файлы, что и CDN и jquery-ui, и добавил и, кажется, работает.

Смежные вопросы