DataTable Layout работает, но не выполняет никаких других действий, таких как поиск, сортировка и т. Д. - PullRequest
Новая
       7

DataTable Layout работает, но не выполняет никаких других действий, таких как поиск, сортировка и т. Д.

0 голосов
/ 09 октября 2019

Я использовал Datatables, чтобы моя общая таблица выглядела хорошо. Он начал работать точно так же, как показ количества страниц и окно поиска. Но он не выполняет никаких функций, таких как поиск или нумерация страниц.

Вот мой код 

<?php include 'db.php'; ?>
<!DOCTYPE html>
<html>
<head>
    <title></title>
    <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css" integrity="sha384-ggOyR0iXCbMQv3Xipma34MD+dH/1fQ784/j6cY/iJTQUOhcWr7x9JvoRxT2MZw1T" crossorigin="anonymous">
    <!-- Jquery -->
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>

    <!-- DataTables -->
    <link rel="stylesheet" type="text/css" href="//cdn.datatables.net/1.10.19/css/jquery.dataTables.min.css">
    <script type="text/javascript" src="//cdn.datatables.net/1.10.19/js/jquery.dataTables.min.js"></script>

    <script type="text/javascript">
        $.extend( true, $.fn.dataTable.defaults, {
            "info": false
        } );

        $(document).ready( function () {
            $('#myTable').DataTable();
        } );
    </script>
</head>
<body>
    <table id="myTable" width="99.8%" class="order-column table table-striped table-bordered table-hover">
        <thead>
            <tr>
                <th scope="col">Date</th>
                <th scope="col">Time</th>
                <th scope="col">Subject</th>
                <th scope="col">Category</th>
                <th scope="col">Actions</th>
            </tr>
        </thead>
        <?php 
        $sql = "SELECT * FROM hr;";
        $result  = mysqli_query($conn , $sql);

        while($row = mysqli_fetch_assoc($result)) : ?>

            <tbody>
                <tr>
                    <?php
                    $id = $row['hr_id']; 
                    $timestamp = $row['timeSent'];
                    $date = date('d-m-Y',strtotime($timestamp));
                    $time = date('H:i:s',strtotime($timestamp)); ?>
                    <td><?php echo $date;?></td>
                    <td><?php echo $time;?></td>
                    <td><?php echo $row['subject'];?></td>
                    <td><?php 
                    $cat =  $row['category_id'];
                    if($cat == 1){
                        echo "Suggestion";
                    }
                    elseif ($cat == 2) {
                        echo "Claim";
                    }
                    else{
                        echo "Help";
                    }?></td>
                    <td><a class="btn btn-outline-primary btn-sm" <?php echo "href='HrThread.php?id=$id'" ?> >See More</a></td>     
                </tr>
            <?php endwhile; ?>
        </tbody>
    </table>


    <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.3/umd/popper.min.js" integrity="sha384-ZMP7rVo3mIykV+2+9J3UJ46jBk0WLaUAdn689aCwoqbBJiSnjAK/l8WvCWPIPm49" crossorigin="anonymous"></script>
    <script src="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/js/bootstrap.min.js" integrity="sha384-ChfqqxuZUCnJSK3+MXmPNIyE6ZbWh2IMqE241rYiqJxyMiZ6OW/JmZQ5stwEULTy" crossorigin="anonymous"></script>
</body>
</html>

Выборка данных работает нормально. Стол выглядит хорошо также. Единственное, что я хочу, - это чтобы он работал правильно, как это должно быть с датой.

1 Ответ

0 голосов
/ 09 октября 2019

Я изменил некоторые из ваших тегов script и link, немного переместил их и изменил код на: 

<?php include 'db.php'; ?>
<!DOCTYPE html>
<html>
<head>
    <title></title>
    <link rel="stylesheet" href="http://cdn.datatables.net/1.10.2/css/jquery.dataTables.min.css"></style>
    <link href="http://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css" rel="stylesheet"> 

</head>
<body>
    <table id="myTable" width="99.8%" class="order-column table table-striped table-bordered table-hover">
        <thead>
            <tr>
                <th scope="col">Date</th>
                <th scope="col">Time</th>
                <th scope="col">Subject</th>
                <th scope="col">Category</th>
                <th scope="col">Actions</th>
            </tr>
        </thead>
        <?php 
        $sql = "SELECT * FROM hr;";
        $result  = mysqli_query($conn , $sql);

        while($row = mysqli_fetch_assoc($result)) : ?>

            <tbody>
                <tr>
                    <?php
                    $id = $row['hr_id']; 
                    $timestamp = $row['timeSent'];
                    $date = date('d-m-Y',strtotime($timestamp));
                    $time = date('H:i:s',strtotime($timestamp)); ?>
                    <td><?php echo $date;?></td>
                    <td><?php echo $time;?></td>
                    <td><?php echo $row['subject'];?></td>
                    <td><?php 
                    $cat =  $row['category_id'];
                    if($cat == 1){
                        echo "Suggestion";
                    }
                    elseif ($cat == 2) {
                        echo "Claim";
                    }
                    else{
                        echo "Help";
                    }?></td>
                    <td><a class="btn btn-outline-primary btn-sm" <?php echo "href='HrThread.php?id=$id'" ?> >See More</a></td>     
                </tr>
            <?php endwhile; ?>
        </tbody>
    </table>

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
<script type="text/javascript" src="http://cdn.datatables.net/1.10.2/js/jquery.dataTables.min.js"></script>
<script type="text/javascript" src="http://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/js/bootstrap.min.js"></script>
 <script type="text/javascript">
        $.extend( true, $.fn.dataTable.defaults, {
            "info": false
        } );

        $(document).ready( function () {
            $('#myTable').DataTable();
        } );
    </script>
</body>
</html>

Попробуйте изменить код на это. У меня нет данных для заполнения таблицы, но это, похоже, делало нумерацию страниц и функциональность поиска, и все, что должен делать dataTable, похоже, работает для меня.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.

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

...