我创建了一个带有两个选择下拉列表的网页:一个用于选择飞行器类型,另一个用于选择飞行员座位。我遇到的问题是,当我选择一个选项时,另一个选项中的内容消失了。我想同时显示所选机型的基本重量和所选飞行员座位的重量。
下面是我试图实现的一个例子:
- 如果我选择
Aircraft Type: M503-1
,我可以看到显示的飞机类型的基本重量。 - 然后,如果我选择
Pilot Seat Type: Captain
,我希望看到M503-1
的基本重量和Captain
座位的重量一起显示在页面上。
我已经尝试使用会话变量来存储$basicWeight
和$pilotSeatWeight
的值,但它似乎不能像预期的那样工作。如何确保$basicWeight
和$pilotSeatWeight
根据两个下拉列表中的选择一起回显?
<?php
session_start();
$_SESSION['selectedAircraftID'] = "0";
?>
<!--AIRCRAFT DETAIL TABLE-->
<?php
include 'db.php';
$aircraftID = '0';
$basicWeight = '0';
$CGArm = '0';
$lat = '0';
if(isset($_POST['aircraftType'])) {
$selectedAircraftID = $_POST['aircraftType'] ;
$sql = "SELECT * FROM aircraft WHERE aircraftID = '$selectedAircraftID'";
$result = $conn->query($sql);
if ($result->num_rows > 0) {
while ($row = $result->fetch_assoc()) {
$aircraftID = $row['aircraftID'];
$basicWeight = $row['basicWeight'];
$CGArm = $row['CGArm'];
$lat = $row['lat'];
}
}
}
?>
<!--Basic Weight ROW PHP-->
<?php
include 'db.php';
if (isset($_POST['aircraftType'])) {
$selectedAircraftID = $_POST['aircraftType'];
$sql = "SELECT * FROM aircraft WHERE aircraftID = '$selectedAircraftID'";
if ($selectedAircraftID == "N/A") {
$aircraftID = "0";
$basicWeight = "0";
$CGArm = "0";
$lat = "0";
} else {
$result = $conn->query($sql);
if($result-> num_rows > 0) {
while($row = $result -> fetch_assoc()){
$aircraftID = $row['aircraftID'];
$basicWeight = $row['basicWeight'];
$CGArm = $row['CGArm'];
$lat = $row['lat'];
}
}
}
} else {
$conn->close();
}
?>
<!--PILOT ROW PHP-->
<?php
$pilotSeatWeight = '0';
$pilotSeatLong = '0';
$pilotSeatLat = '0';
include 'db.php';
if (isset($_POST['pilotSeatType'])) {
$selectedseatID = $_POST['pilotSeatType'];
$sql = "SELECT * FROM mainseat WHERE seatID = '$selectedseatID'";
$result = $conn->query($sql);
if($result-> num_rows > 0) {
while($row = $result -> fetch_assoc()){
$pilotSeatWeight = $row['seatWeight'];
$pilotSeatLong = $row['seatLong'];
$pilotSeatLat = $row['seatLat'];
}
}
} else {
$conn->close();
}
?>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Weight and balance calculation</title>
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Roboto:wght@400;500;700&display=swap" rel="stylesheet">
<link rel="stylesheet" href="styles/home.css">
</head>
<body>
<div class="aircraft-details-container">
<div class="aircraft-details-header">Aircraft Details</div>
<table class="aircraft-details-table">
<thead>
<tr>
<th class="aircraft-details-th">DATE</th>
<th class="aircraft-details-th">AIRCRAFT</th>
<th class="aircraft-details-th">BASIC WEIGHT</th>
<th class="aircraft-details-th">C OF G</th>
<th class="aircraft-details-th">LAT(MM)</th>
</tr>
</thead>
<tbody>
<tr>
<td class="aircraft-details-td">
<input class="aircraft-details-date" type="date" name="selectedDate">
</td>
<td class="aircraft-details-td">
<form method="POST" id="aircraftForm">
<select class="aircraft-select" name="aircraftType" onchange="submitForm()">
<option value="-" >N/A</option>
<?php
include 'db.php';
if (isset($_POST['aircraftType'])) {
$selectedAircraftID = $_POST['aircraftType'];
} else {
$selectedAircraftID = "-";
}
$sql = "SELECT * FROM aircraft";
$result = $conn->query($sql);
while($row = $result-> fetch_assoc ()) {
$aircraftID = $row['aircraftID'];
if ($aircraftID == $selectedAircraftID) {
$selected = 'selected';
} else {
$selected = '';
}
echo "<option value='$aircraftID' $selected>$aircraftID</option>";
}
?>
</select>
</form>
</td>
<td class='aircraft-details-td'><?php echo $basicWeight ?></td>
<td class='aircraft-details-td'><?php echo $CGArm ?> </td>
<td class='aircraft-details-td'><?php echo $lat ?> </td>
</tr>
</tbody>
</table>
</div>
<!---Passenger Details Table -->
<div class="passenger-details-container">
<div class="passenger-details-header">Passenger Details</div>
<table class="passenger-details-table">
<thead>
<tr>
<th class="passenger-details-th">ITEM</th>
<th class="passenger-details-th">WIGHT (KG)</th>
<th class="passenger-details-th">SEAT</th>
<th class="passenger-details-th">ROW</th>
<th class="passenger-details-th">SEAT WEIGHT (KG)</th>
<th class="passenger-details-th">CG ARM (MM)</th>
<th class="passenger-details-th">MOMENTS LONG (KGMM)</th>
<th class="passenger-details-th">LAT(MM)</th>
<th class="passenger-details-th">MOMENTS LAT (KGMM)</th>
</tr>
</thead>
<tbody>
<!--BASIC WEIGHT ROW -->
<tr>
<td class='passenger-details-td'>Basic Weight</td>
<td class='passenger-details-td'><?php echo $basicWeight; ?></td>
<td class='passenger-details-td'>N/A</td>
<td class='passenger-details-td'>N/A</td>
<td class='passenger-details-td'>N/A</td>
<td class='passenger-details-td'><?php echo $CGArm; ?></td>
<td class='passenger-details-td'><?php echo(floatval($basicWeight) * floatval($CGArm)); ?></td>
<td class='passenger-details-td'><?php echo $lat; ?></td>
<td class='passenger-details-td'><?php echo (floatval($basicWeight) * floatval($lat)); ?></td>
</tr>
<!--PILOT ROW -->
<tr>
<td class='passenger-details-td'>Pilot</td>
<td class='passenger-details-td'>80.0</td>
<td class='passenger-details-td'>
<form id="pilotForm" method="POST">
<select class="select-main" name="pilotSeatType" onchange="submitpilotForm()">
<option value="-">N/A</option>
<?php
$pilotSeatType = "";
if (isset($_POST['pilotSeatType'])) {
$pilotSeatType = $_POST['pilotSeatType'];
}
?>
<option value="pilotSeat" <?php if ($pilotSeatType === 'pilotSeat') echo 'selected'; ?>>Pilot Seat</option>
<option value="coPilotSeat" <?php if ($pilotSeatType === 'coPilotSeat') echo 'selected'; ?>>Co Pilot Seat</option>
<select>
</form>
</td>
<td class='passenger-details-td'>N/A</td>
<td class='passenger-details-td'><?php echo $pilotSeatWeight; ?></td>
<td class='passenger-details-td'><?php echo $pilotSeatLong; ?></td>
<td class='passenger-details-td'><?php echo (floatval(80) * $pilotSeatWeight); ?></td>
<td class='passenger-details-td'><?php echo $pilotSeatLat; ?></td>
<td class='passenger-details-td'><?php echo (floatval(80) * $pilotSeatLat); ?></td>
</tr>
<script>
function submitForm() {
document.getElementById("aircraftForm").submit();
}
function submitpilotForm() {
document.getElementById("pilotForm").submit();
}
</script>
</tbody>
</table>
</div>
</body>
</html>
1条答案
按热度按时间xurqigkl1#
你的代码有点遗漏,但我试图回答主要问题。您应该添加2个隐藏的输入到您的表单来处理从另一个表单中选择的选项。
因此,当用户更改其中一个表单时,值将通过$_POST保存在其他表单隐藏输入上。但请记住,如果用户不断更改选择值或同时更改选择,这可能会产生冲突!
更好的方法应该是使用jQuery $.post, AJAX 甚至XMLHttpRequest。这样,您就可以动态更新表单和值,而不会发生任何冲突。如果你需要更多的细节,选择你的方式,让我知道你想走哪条路。