javascript - 如何在 PHP 中附加选项元素和值并在 ajax 中调用 html

Question

我有两个<select>，我想要实现的是，当我选择一个数据时，它会调用我所做的 ajax，然后从另一个<select元素附加它的值，然后它有<option>。我尝试提醒并且成功提醒<option>，但是当我尝试将它附加到 HTML 中，它说[object Object]，我希望有人能提供帮助，并向我解释，以便将来每当我遇到这样的问题时，我都有回溯。太感谢了。

PHP代码在这里：

echo '<option value="'.$row['name'].'">'. $row['name'] .'</option>';

HTML 和 JQuery

function setDept(element) {
  let dept = $(element).val();
  if (dept) {

    $.ajax({
      type: "post",
      url: "myform.php",
      data: {
        "department": dept
      },
      success: function(response) {
        // alert(response);
        $('#sel_requested_dept').append(response);
      }
    });

  }
}

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

<div class="form-group">
  <label> Teacher: </label>
   <select class="form-control selectpicker" name="teacher"
    data-live-search="true" onchange="setDept(this)" required>
    <option value="" selected disabled> Select Teacher </option>
     <?php
       $query = "SELECT * FROM teachers";
       $con->next_result();
       $result=mysqli_query($con,$query);
       if(mysqli_num_rows($result)>0)
       {
          while($row=mysqli_fetch_assoc($result))
          {
                echo '<option value="'.$row['teacher_name'].'">'. $row['section'] ." - ".  
                $row['teacher_name'] .'</option>';
          }
       }                                               
      ?>
     </select>
   </div>    

<div class="form-group">
  <label> Department </label>
  <select name="request_dept" id="sel_requested_dept" class="form-control selectpicker" data-live-search="true" required>
    <option value="" selected disabled> Select Department </option>

  </select>
</div>

标签： javascriptjqueryajax