Question

我想在下拉选择的基础上获取数据mysql。我希望我的下拉有3个选项10,20,30。当我点击10时，我的页面中显示的前10条记录。当我点击20页时，显示页面中显示的前20条记录。我尝试过但没能做到。请任何人都可以帮我怎么做。如果给我一个这样的例子，我会很高兴你。我正在使用mysql的PDO扩展。

<?php
  include('config.php');
  session_start();
?>
<!DOCTYPE html>
<html lang="en">
<head>
<script   src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
</head>
<body>
<div id="resultdiv">
    <form method="POST">
         <table  class="table table-striped table-bordered" cellspacing="0" width="100%">
            <thead>
               <tr>
                 <th>Video ID</th>
                 <th>Video Name</th>
               </tr>
            </thead>
           <?php
           $access = $_SESSION['login'];
           $sql = "SELECT * FROM videos ORDER BY id desc";
           $query = $conn->query($sql);
            $i=1;
            while ($row = $query->fetch(PDO::FETCH_ASSOC)){
               $id = $row['id'];
               $video_name = $row['video_name'];
               echo "
                    <tbody>
                        <tr>
                          <td style='text-align:center;'>$id</td>
                          <td id='test10' class='text-center'><b>$video_name</b></td>
                          <td style='text-align:center;'>
                          <a href='add-video3.php?id=$id' class='btn btn-info'>EDIT</a><br><br>
                          <a href='delete_video.php?id=$id' class='btn btn-danger' rel='tooltip' title='Delete'><i class='glyphicon glyphicon-trash'></i></a>
                        </tr>
                   </tbody>";
                 } $i++;
               }
               else {
                   header ("location:index.php");
                    }
           ?>
       </table>
     </form>    
</div>
</body>

现在如何与我的数据库进行通信。

Answer 1

我看到你正在使用Javascript。也许你应该在不重新加载页面的情况下完成它。只需显示所有条目，然后将它们全部隐藏起来，并显示好条目。

＆＃13;

//Populate table
for(var i = 1; i<=30; i++){
  $('table tbody').append('<tr><td>Row '+i+'</td></tr>');  
}

//Listener on select change
$('select').on('change', function(){
  var value = $(this).val();
  $('table tbody tr').hide();
  for(var i = 0; i<value; i++){
    //Find the i tr on the table
    $('table tbody tr').eq(i).show(); 
  }
});

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<select id="dropdown">
  <option value="10">10</option>
  <option value="20">20</option>
  <option value="30" selected>30</option>  
</select>

<table>
  <tbody>
    
  </tbody>
</table>

＆＃13;

自定义代码

<?php
include('config.php');
session_start();

$access = $_SESSION['login'];
$sql = "SELECT * FROM videos ORDER BY id desc";
$query = $conn->query($sql);

?>
<!DOCTYPE html>
<html lang="en">
<head>
</head>
<body>
  <div id="resultdiv">
    <!-- start data table -->
    <table  class="table table-striped table-bordered" cellspacing="0" width="100%">
      <thead>
        <tr>
          <th>Video ID</th>
          <th>Video Name</th>
        </tr>
      </thead>

      <tbody>
        <?php
        while ($row = $query->fetch(PDO::FETCH_ASSOC)){
          $id = $row['id'];
          $video_name = $row['video_name'];
          echo "
          <tr>
           <td style='text-align:center;'>$id</td>
           <td id='test10' class='text-center'><b>$video_name</b></td>

           <td style='text-align:center;'>
             <a href='add-video3.php?id=$id' class='btn btn-info'>EDIT</a><br><br>
             <a href='delete_video.php?id=$id' class='btn btn-danger' rel='tooltip' title='Delete'><i class='glyphicon glyphicon-trash'></i></a>
           </tr>";
         }

         ?>
       </tbody>
     </table>
     <label for="select-row">Show </label>
     <select id="select-row">
       <option value="10">10</option>
       <option value="20">20</option>
       <option value="30">30</option>
       <option value="50">50</option>
     </select>
     <!-- End data table --> 
   </div>

  <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
   <script type="text/javascript">
     //Listener on select change
    $('select').on('change', function(){
      var value = $(this).val();
      $('table tbody tr').hide();
      for(var i = 0; i<value; i++){
        //Find the i tr on the table
        $('table tbody tr').eq(i).show(); 
      }
    });
   </script>
 </body>

Answer 2

//Populate table
for(var i = 1; i<=30; i++){
$('table tbody').append('<tr><td>Row '+i+'</td></tr>');  
}

//Listener on select change
$('select').on('change', function(){
var value = $(this).val();
$('table tbody tr').hide();
for(var i = 0; i<value; i++){
//Find the i tr on the table
$('table tbody tr').eq(i).show(); 
}
});


<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<select id="dropdown">
  <option value="10">10</option>
  <option value="20">20</option>
  <option value="30" selected>30</option>  
</select>

 <table>
  <tbody>

  </tbody>
 </table>

下拉从mysql中选择数据

2 个答案: