php - 选择后从后续选择列表中删除选项
问题描述
我正在使用一个统计应用程序,它将玩家(从数据库中的数据获得)附加到特定位置。如果球员已经被选中,我希望球员在即将到来的位置被选中时消失,这样同一个球员就不能被置于两个不同的位置。谁能建议在这里做什么这是我总结的代码
<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>
解决方案
使用您的播放器创建一个,并使用 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>
推荐阅读
- javascript - 从 HTML 动态获取 getElementId
- c++ - c ++通过构造函数选择推断bool类模板参数
- amazon-web-services - 使用 moto 进行基本的 AWS Glacier 模拟失败
- kubernetes - 如何在 Kubernetes(仅生产者端事务)设置中选择 Kafka transactional.id
- javascript - :target 什么时候计算?
- python - Plotly Python:如何在零上隐藏网格刻度?
- android - Android - 文本的图像右侧与屏幕水平重叠
- salesforce - Salesforce中的数组查询
- ocaml - OCaml - 为什么不是 Monad
- mobile - 与 Testproject、TestSigma 等 AI 自动化工具相比,使用 Appium 有什么优势?