Question

我有一个名为“课程”的下拉列表，其中包含选项（math101，eng102 ..等）我想要另外一个名为（学生姓名）的下拉列表，但是这个应该被隐藏，所以当用户从课程列表中选择一个值时，学生姓名的列表现在将显示给学生的名字，用户可以选择一个...当然所有数据都将从数据库中获取

到目前为止，我的代码是

<?php

   include('../connect.php');
   $id=$_SESSION['login_user'];



      $sql = "SELECT CourseName from Course ";
         $result = mysql_query ($sql, $connection);

         echo "<tr><th>Course Name </th>";
         echo "<td><select id='CourseName' name='v1' >";
        while( $row = mysql_fetch_array($result))
   {
        echo "<option value='$row[CourseName]' selected='selected'>$row[CourseName]</option> ";

   }
     echo "</select>";
     echo "</td>";
     echo "</tr>" ;


  $sql = "SELECT StudentName from Student ";
         $result = mysql_query ($sql, $connection);

         echo "<tr><th>Student Name </th>";
         echo "<td><select id='StudentName' name='v2' >";
        while( $row = mysql_fetch_array($result))
   {
        echo "<option value='$row[StudentName]' selected='selected'>$row[StudentName]</option> ";

   }
     echo "</select>";
     echo "</td>";
     echo "</tr>" ;




     echo "</table>" ;
     echo "</font>" ;

    ?>

我的两张桌子是

课程：CourseName var（30） CourseID int（7）

学生：StudentName var（40）学生证int（7） CourseID int（7）

所以我的问题是，如何使“学生姓名”成为隐藏下拉列表取决于“课程”列表，因此当用户选择一门课程时，所有学生都会选择参加此课程的名称（按课程ID）？ / p>

Answer 1

我这样做的方法是使用javascript / jQuery / Ajax。请注意，这是未经测试的，因为我刚刚复制并粘贴了这些示例。

在原始文件中进行以下更改 -

$sql = "SELECT CourseName from Course ";
$result = mysql_query ($sql, $connection);

  echo "<tr><th>Course Name </th>";
  echo "<td><select id='CourseName' name='v1' onchange='students()' >"; // Added on Change
  echo "<option value='' selected='selected'>Select</option> ";
  while( $row = mysql_fetch_array($result))
  {
  echo "<option value='$row[CourseID]'>$row[CourseName]</option> ";  // make the value = to CourseID
  }
 echo "</select>";
 echo "</td>";
 echo "</tr>" ;

 // removed sql query to get students, 

 echo "<tr><th>Student Name </th>";
 echo "<td><select id='StudentName' name='v2' >";  //builds a blank student select
 echo "</select>";
 echo "</td>";
 echo "</tr>" ;

 echo "</table>" ;

在文件的头部添加以下javascript / jQuery / Ajax

<head>
...
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.min.js"></script> //can be changed to other version ie. 1.7.../1.8.. etc
<script type="text/javascript">
function students(){   
$("#StudentName option").remove();  // empties out the StudentName select so we can rebuild
var course = $('#CourseName').val();  //this gets the value of the selected Course
if(course != ""){ // we will only get students if a Course is selected
  jQuery.ajax({
  type: "POST",
  url: "students.php",
  data: 'course='+course,
  cache: false,
  success: function(response){
  var student_array = JSON.parse(response);
  $.each(student_array, function() {
  $("<option />").attr("value", student_array).text(student_array).appendTo("#StudentName");  // adds new StudentName select options
  });
  }
});
}
</script>
...
</head>

创建一个单独的文件students.php - （或在Ajax中重命名url以匹配）

<?php
include('../connect.php');
$course = mysql_real_escape_string($_POST['course']); // gets course that was sent via Ajax
$sql  = "SELECT StudentName from Student";
$sql .= " WHERE CourseID = '$course'";  // get only students with selected CourseID
$result = mysql_query ($sql, $connection);
 while( $row = mysql_fetch_array($result))
 {
    $student_array[] = $row[StudentName];
 }
 $student_array = json_encode($student_array);  // encodes it to send back
 print_r($student_array);   // prints the array to use
 ?>

请注意，您不应使用mysql_*函数编写新代码。相反，应使用MySQLi或PDO_MySQL扩展名。见MySQL: choosing an API guide

Answer 2

如果你不想使用我提供的Ajax / jQuery答案，这是另一种方法。选择课程后，系统会根据StudentName的{{1}}选择重新加载页面。这是通过向CourseID选择添加1个javascript代码onchange='this.form.submit();'，然后在CourseID选择周围添加isset($_POST['v1'])来实现的。

StudentName

PHP - 由于选择而显示/隐藏下拉列表

2 个答案: