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

$(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。
有人能告诉我我的代码有什么问题吗?

最佳答案

$("#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
            }
        });
    })
});

10-05 20:50
查看更多