Javascript 将数据从数据库加载到下拉选择中，无需POST

在HTML模式中，我有两个下拉选择，一个用于团队，另一个用于玩家

团队下拉选择从数据库中提取数据。每个队员被分配到一个队

我要做的是，当我更改球队下拉选择时，球员下拉选择会根据所选球队进行更改，这意味着它将只包含所选球队的球员

==>我想在不关闭模式和不刷新页面的情况下完成此操作

---

如何做到这一点？

您需要以这种方式使用jQuery：

$("#teams").on('change',function(){
    $.ajax({url: "your_url_here", success: function(result){
       $.each(result, function( index, value ) {
          $('#players').append('<option value="'your_value here'">'your_data_here'</option>')
       });
    }});
});

---

我希望这会有所帮助。您将需要使用Ajax和Jquery库

main.php

getPlayers.php

---

使用ajax请求获取数据您可以使用ajax最佳方法，也可以全部加载它们，分配不同的ID，然后根据ID切换不同的下拉列表，但这将非常愚蠢。有ajax建议吗？

$("#teams").on('change',function(){
    $.ajax({url: "your_url_here", success: function(result){
       $.each(result, function( index, value ) {
          $('#players').append('<option value="'your_value here'">'your_data_here'</option>')
       });
    }});
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<select id="teams" name="teams">            
 <?php
 $sql = $bdd->query('SELECT id_team, name FROM teams;');
 while($fetch = $sql->fetch(PDO::FETCH_ASSOC)){ ?>                      
   <option id="opt-<?php echo $fetch['id_team']; ?>"><?php echo $fetch['name']; ?></option>
 <?php } ?>
</select>

<select id="players" name="players"></select>

<script>
    $( "#teams" ).change(function() {
        var id = $(this).children(":selected").attr("id");
        var id_split = id.split("-");
        $.ajax({
            url: "getPlayers.php",
            type: "post",
            data: {id: id_split[1]},
            success: function (response) {
                document.getElementById("players").innerHTML = response;
            },
            error: function(jqXHR, textStatus, errorThrown) {
                console.log(textStatus, errorThrown);
            }
        });
    });
</script>

<?php
if(isset($_POST['id'])){
  $id = $_POST['id']; 
    //sql connection
  $sql = $bdd->query("SELECT id_player, name FROM players where id_team = $id");
  while($fetch = $sql->fetch(PDO::FETCH_ASSOC)){ ?>                      
    <option id="opt-<?php echo $fetch['id_player']; ?>"><?php echo $fetch['name']; ?></option>
 <?php }
}
?>