ajax для изменения содержимого из выпадающего списка не работает

#javascript #php #jquery #html #ajax

#javascript #php #jquery #HTML #ajax

Вопрос:

Я создал веб-сайт. Я создал в нем выпадающий список для отображения разных данных, в то время как пользователь выбирает другой выпадающий список, мой код выглядит следующим образом

 $(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.

Кто-нибудь может сказать мне, что не так с моим кодом?

Ответ №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
            }
        });
    })
});
  

Комментарии:

1. ошибки нет, при нажатии на выпадающий список страница переходит на другую страницу, отображающую данные таблицы, но когда пользователь нажимает на выпадающий список с результирующей страницы, данные не отображаются. пользователь должен вернуться на старую страницу, а затем выбрать выпадающий список оттуда