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