jquery数据表上的分页和过滤问题

时间:2017-07-14 05:13:05

标签: php jquery datatables

This is my table view

我使用JQuery Datatables,我认为它很简单,因为JQuery Datatables包含分页和过滤框。我的问题是分页不起作用(你可以看到表格只显示1个条目中的1到1个,而表格中有2个条目)以及过滤

这是我的观看代码

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta name="description" content="">
    <meta name="author" content="Dashboard">
    <meta name="keyword" content="Dashboard, Bootstrap, Admin, Template, Theme, Responsive, Fluid, Retina">
    <link rel="shortcut icon" href="<?php echo base_url();?>assets/welcome/images/logo.png"> 
    <title>Home Guru</title>

    <!-- Bootstrap core CSS -->
    <link href="<?php echo base_url(); ?>assets/home/css/bootstrap.css" rel="stylesheet">
    <!--external css-->
    <link href="<?php echo base_url(); ?>assets/home/font-awesome/css/font-awesome.css" rel="stylesheet"/>
    <link rel="stylesheet" type="text/css" href="<?php echo base_url(); ?>/assets/home/lineicons/style.css">    

    <!-- Custom styles for this template -->
    <link href="<?php echo base_url(); ?>assets/home/css/style.css" rel="stylesheet">
    <link href="<?php echo base_url(); ?>assets/home/css/style-responsive.css" rel="stylesheet">
    <link rel="stylesheet" type="text/css" href="<?php echo base_url(); ?>assets/komponen/jquery-datatable/skin/bootstrap/css/dataTables.bootstrap.css" rel="stylesheet">

  </head>

  <body>

  <section id="container" >
      <header class="header black-bg">
              <div class="sidebar-toggle-box">
                  <div class="fa fa-bars tooltips" data-placement="right" data-original-title="Toggle Navigation"></div>
              </div>
            <!--logo start-->
            <a href="#" class="logo"><b>E-School</b></a>
            <!--logo end-->
            <div class="top-menu">
                <ul class="nav pull-right top-menu">
                    <li><a class="logout" href="<?php echo site_url('c_user/logout');?>">Logout</a></li>
                </ul>
            </div>
        </header>
      <!--header end-->

      <!--sidebar start-->
      <aside>
          <?php $this->load->view("menu.php"); ?>
      </aside>
      <!--sidebar end-->

      <!-- **********************************************************************************************************************************************************
      MAIN CONTENT
      *********************************************************************************************************************************************************** -->
      <!--main content start-->
     <section id="main-content">
          <section class="wrapper">
                <h3><i class="fa fa-pencil"></i> Daftar Siswa Anda</h3>
              <div class="row mt">
                <div class="col-lg-12">
                  <div class="form-panel">
                      <table class="table table-striped table-advance table-hover " id= "tabel-reward">
                              <h4><i class="fa fa-angle-right"></i> Siswa</h4>
                              <hr>
                              <thead>
                              <tr>
                                  <th>NISN</th>
                                  <th>Nama</th>
                                  <th>Kelas</th>
                                  <th></th>
                                  <th>Action</th>
                              </tr>
                              </thead>

                               <?php foreach($siswa as $student){?>
                              <tbody>
                              <tr>
                                  <td><?php echo $student->no_id;?></td>
                                  <td><?php echo $student->nama;?></td>
                                  <td><?php echo $student->nama_kelas;?></td>
                                  <td></td>
                                  <td>

                                <a class="btn btn-primary btn-xs" href="<?php //echo base_url()."c_kuis/buatSoalKuis/".$kuis->id_ks."/".$kuis->jenis_kuis;?>" ><i class="fa fa-pencil"></i> Beri Reward</a> 
                                  </td>
                              </tr>
                              <?php } ?>
                              </tbody>

                          </table>  
                  </div>
                </div><!-- col-lg-12-->         
            </div><!-- row -->
          </section>
      </section>
      <!--main content end-->
      <!--footer start-->
      <!--<footer class="site-footer">
          <div class="text-center">
              <small class="copyright">&copy; 2017 E-School SMP Negeri 1 Cikarang Barat</small>
          </div>
      </footer>-->
      <!--footer end-->
  </section>

    <!-- js placed at the end of the document so the pages load faster -->
    <script src="<?php echo base_url(); ?>assets/home/js/jquery.js"></script>
   <!-- <script src="<?php //echo base_url(); ?>assets/home/js/jquery-1.8.3.min.js"></script>-->
    <script src="<?php echo base_url(); ?>assets/home/js/bootstrap.min.js"></script>
    <!--<script class="include" type="text/javascript" src="<?php echo base_url(); ?>/assets/home/js/jquery.dcjqaccordion.2.7.js"></script>-->
    <script src="<?php echo base_url(); ?>assets/home/js/jquery.scrollTo.min.js"></script>
    <script src="<?php echo base_url(); ?>assets/home/js/jquery.nicescroll.js" type="text/javascript"></script>
    <script src="<?php echo base_url(); ?>assets/home/js/jquery.sparkline.js"></script>
    <script type="text/javascript" src="<?php echo base_url(); ?>assets/komponen/jquery-datatable/jquery.dataTables.js"></script>
    <script src="<?php echo base_url(); ?>assets/komponen/jquery-datatable/skin/bootstrap/js/dataTables.bootstrap.js"></script>
       <script type="text/javascript">
        $(document).ready( function () {
            $('#tabel-reward').DataTable();  
        } );
    </script>

    <!--common script for all pages-->
    <script src="<?php echo base_url(); ?>/assets/home/js/common-scripts.js"></script>
  </body>
</html>

请帮我查一下我的代码问题。谢谢。

0 个答案:

没有答案