ajax从下拉列表中更改内容不起作用

Question

我创建了一个网站。我在其中创建了一个下拉菜单，用于在用户选择不同的下拉菜单时显示不同的数据，我的代码如下

$(document).ready(function(){
// code to get all records from table via select box
$("#course_title").change(function() {
var tid = $(this).find(":selected").val();
var dataString = 'tid='+ tid;
$.ajax({
url: 'mycourses.php',
dataType: "json",
data: dataString,
cache: false,
success: function(employeeData) {
if(employeeData) {
$("#heading").show();
$("#no_records").hide();
$("#emp_name").text(employeeData.tid);
$("#emp_age").text(employeeData.training_name);
$("#records").show();
} else {
$("#heading").hide();
$("#records").hide();
$("#no_records").show();
}
}
});
})
});

<select class="form-control sel" name="trainings" id="trainings" >
				  <option value="select options" selected disabled>Select Training Course</option>
<?                      $sql_trainings = "SELECT * FROM tbl_data";
                      $trainings_data = mysqli_query($con,$sql_trainings);
                      while($row = mysqli_fetch_assoc($trainings_data) ){
                          $trainingid = $row['tid'];
                          $training_name = $row['training_name'];


                          echo "<option value='".$trainingid."' >".$training_name."</option>";
                      }
                      ?>


					</select>

我有另一个页面 getcourses.php 如下

<?php
include "config.php";

$trainingid = $_POST['tid'];   // department id

$sql = "SELECT tid,training_name FROM tbl_data WHERE id=".$departid;

$result = mysqli_query($con,$sql);

$users_arr = array();

while( $row = mysqli_fetch_array($result) ){
    $userid = $row['tid'];
    $name = $row['training_name'];

    $users_arr[] = array("tid" => $userid, "training_name" => $name);
}

// encoding array to json format
echo json_encode($users_arr);

下拉菜单首先显示在一个页面中，然后当用户点击下拉菜单时，他们会被带到不同的页面，显示他们选择的下拉菜单的内容，当用户第一次点击下拉菜单时显示内容并且是被带到不同的页面以显示内容，但是当用户从结果页面单击不同的下拉菜单时，下拉菜单不起作用，没有任何反应，我想显示用户在结果页面中选择的下拉菜单的内容，每当用户更改它应该出现的下拉菜单。我的表名是 tbl_data，我的列是 tid 和 training_name。

谁能告诉我我的代码有什么问题？

Answer 1

$("#course_title").change(function() {

应该是，

$("#trainings").change(function() {

所以你的 js 代码应该是这样的，

$(document).ready(function() {
    // code to get all records from table via select box
    $("#trainings").change(function() {
        var tid = $(this).val(); // this is enough to get selected value
        $.ajax({
            url: 'mycourses.php',
            type: 'POST', // you forgot type 
            data: {tid : tid},
            success: function(employeeData) {
                // same as your code
            }
        });
    })
});