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
            }
        });
    })
});