单击不同选项卡

时间:2015-12-02 06:50:29

标签: javascript datatable

我的数据表无法显示搜索栏并在单击其他选项卡时进行排序。它只会在主要选项卡上显示搜索栏和排序

我的数据表代码

<div id="page-wrapper">
    <div class="row"> 
        <div class="col-lg-12">
            <h1 class="page-header">Class Detail</h1>
        </div>
        <ul class="nav nav-tabs">
            <?php
            $count = 0;
            $qry_cent = mysqli_query($link, "SELECT * from center ORDER BY center_name ASC") or die(mysqli_error());
            while ($data_cent = mysqli_fetch_array($qry_cent)) {
                $count++;
                ?>
                <li <?php if ($count == 1) { ?> class="active" <?php } ?>><a data-toggle="tab" href="#tab<?php echo $data_cent['id']; ?>"><?php echo $data_cent["center_name"]; ?></a>
                </li>
            <?php } ?>
        </ul>
        </br>
        <div class="tab-content">
            <?php
            $count = 0;
            $qry_cent1 = mysqli_query($link, "SELECT * from center ORDER BY center_name ASC") or die(mysqli_error());
            while ($data_cent1 = mysqli_fetch_array($qry_cent1)) {
                $count++;
                ?>
                <div id="tab<?php echo $data_cent1['id']; ?>" class="row tab-pane fade in <?php if ($count == 1) { ?> active <?php } ?>">
                    <div class="col-lg-10 col-lg-offset-1">
                        <div class="panel panel-default ">
                            <div class="panel-body">
                                <div class="dataTable_wrapper">
                                    <table class="table table-striped table-bordered table-hover" id="datatabless">
                                        <thead>
                                            <tr>
                                                <th>S/N</th>
                                                <th>Subject</th>
                                                <th>Day</th>
                                                <th>Start Time</th>
                                                <th>End Time</th>
                                                <th>Tutor</th>
                                                <th>Classroom</th>
                                            </tr>
                                        </thead>
                                        <tbody>
                                            <?php $data_cent2 = $data_cent1['id']; ?>
                                            <?php
                                            $i = 0;
                                            $query = mysqli_query($link, "SELECT * FROM class where center_id='$data_cent2' ORDER BY day") or die(mysqli_error());
                                            while ($row = mysqli_fetch_assoc($query)) {
                                                $i++;
                                                ?>
                                                <tr class="odd gradeX">
                                                    <td><?php echo $i; ?></td>
                                                    <td>
                                                        <?php
                                                        $query_subject = mysqli_query($link, "SELECT * FROM subject WHERE id = " . $row['subject_id'] . " ") or die(mysqli_error());
                                                        $row_subject = mysqli_fetch_array($query_subject);
                                                        echo $row_subject['subject_name'];
                                                        ?>
                                                    </td>
                                                    <td class="center"><?php echo $row['day']; ?></td>
                                                    <td><?php echo $row['start_time']; ?></td>
                                                    <td><?php echo $row['end_time']; ?></td>

                                                    <td>
                                                        <?php
                                                        $query_tutor = mysqli_query($link, "SELECT * FROM tutor WHERE id = " . $row['tutor_id'] . " ") or die(mysqli_error());
                                                        $row_tutor = mysqli_fetch_array($query_tutor);
                                                        echo $row_tutor['tutor_name'];
                                                        ?>
                                                    </td>
                                                    <td>
                                                        <?php
                                                        $query_classroom = mysqli_query($link, "SELECT * FROM classroom WHERE id = " . $row['classroom_id'] . " ") or die(mysqli_error());
                                                        $row_classroom = mysqli_fetch_array($query_classroom);
                                                        echo $row_classroom['room'];
                                                        ?>
                                                    </td>
                                                </tr>
                                            <?php } ?>
                                        </tbody>
                                        <tfoot>
                                            <tr>
                                                <th>S/N</th>
                                                <th>Subject</th>
                                                <th>Day</th>
                                                <th>Start Time</th>
                                                <th>End Time</th>
                                                <th>Tutor</th>
                                                <th>Classroom</th>
                                            </tr>
                                        </tfoot>                                    
                                    </table>
                                </div>
                                <!-- /.datatable-wrapper -->    
                            </div>
                            <!-- /.panel-body -->
                        </div>
                        <!-- /.panel -->
                    </div>
                    <!-- /.col-lg-12 -->
                </div>
            <?php } ?>
        </div>
    </div>     
</div>

运行数据表的脚本

<script>
    $(document).ready(function() {
        $('#datatabless').DataTable({
            responsive: true
        });
    });
</script>

0 个答案:

没有答案