首页 > 解决方案 > 选择后从后续选择列表中删除选项

问题描述

我正在使用一个统计应用程序,它将玩家(从数据库中的数据获得)附加到特定位置。如果球员已经被选中,我希望球员在即将到来的位置被选中时消失,这样同一个球员就不能被置于两个不同的位置。谁能建议在这里做什么这是我总结的代码

<div class="row">
      <div class="col-sm-4">
          <label>1. Goalkeeper</label>
      </div>
      <div class="col-sm-4">
        <select class="form-control">
          <option value="" disabled selected>Select player</option>
          <?php
          include('conn.php');

          $selectplayer= "SELECT * from panel";

          $playerresult=$conn->query($selectplayer);

          if(!$playerresult){
            echo $conn->error;
          }
          while ($select=$playerresult->fetch_assoc()){
            $identify=$select['id'];
            $name=$select['name'];
            echo "<option>$identify. $name</option>";
          }


           ?>


        </select>
      </div>

    </div>
    <div class="row">
      <div class="col-sm-4">
          <label>2. Right corner back</label>
      </div>
      <div class="col-sm-4">
        <select class="form-control">
          <option value="" disabled selected>Select player</option>
          <?php
          include('conn.php');

          $selectplayer= "SELECT * from panel";

          $playerresult=$conn->query($selectplayer);

          if(!$playerresult){
            echo $conn->error;
          }
          while ($select=$playerresult->fetch_assoc()){
            $identify=$select['id'];
            $name=$select['name'];
            echo "<option>$identify. $name</option>";
          }


           ?>

        </select>
      </div>

    </div>
    <div class="row">
      <div class="col-sm-4">
          <label>3. Full back</label>
      </div>
      <div class="col-sm-4">
        <select class="form-control">
          <option value="" disabled selected>Select player</option>
          <?php
          include('conn.php');

          $selectplayer= "SELECT * from panel";

          $playerresult=$conn->query($selectplayer);

          if(!$playerresult){
            echo $conn->error;
          }
          while ($select=$playerresult->fetch_assoc()){
            $identify=$select['id'];
            $name=$select['name'];
            echo "<option>$identify. $name</option>";
          }


           ?>

        </select>
      </div>

    </div>

标签: phpsql

解决方案


使用您的播放器创建一个,并使用 JQuery在datalist选择一个时从中删除:onchange()input

function resetPlayerList(pos) {
 //Get player name
 var player = $('input#' + pos).val();
 //If player exists in datalist
  if($('option[value="' + player + '"]')) {
    //Remove player from datalist meaning other inputs cannot add the player
   $('option[value="' + player + '"]').remove();
  } 
  
  //If changing a player, you need to add the old player back into the datalist. This code does not do that for you.
  
}
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<datalist id="players">
  <option value="1">
  <option value="2">
  <option value="3">
  <option value="4">
  <option value="5">
  <!-- etc. -->
</datalist>

<input id="CF" onchange="resetPlayerList('CF')" list="players"> <!-- Center Forward -->
<br/><br/>
<input id="LW" onchange="resetPlayerList('LW')" list="players"> <!-- Left Wing -->

这将使用 JavaScript/JQuery 从列表中删除播放器。

如果您想在添加播放器后更改播放器,则需要做更多工作,首先将旧设置播放器重新添加回datalist,然后再从中删除新播放器......这有意义吗?

更新

<datalist id="players">
  <?php
  $players = array(
      array(
         'name' => 'Player 1'
      ),
      array(
          'name' => 'Player 2'
      )
   );

   //$players should be your array/object of players from SQL.

   for($players as $player) {
      echo '<option value="' . $player['name'] . '" />'; //or $player->name if object
   }
?>
</datalist>

推荐阅读