如何在 PHP 的下拉菜单中显示我已经 select 的数据？

Question

请问如何在下拉菜单中select姓名后显示sn（员工编号）？例如，如果我从下拉菜单中select 命名为“aziz”，它也应该在文本框中显示aziz 的sn（员工编号），即“1001”。姓名和sn（员工编号）都应该保存到数据库中。在这里我附上我的员工table，包括姓名和sn（员工编号）以及我的系统界面：

下面是我的代码：

 <div class="col-md-6">
    <table width="567">
    <tr>
    <td><b><u>Equipment Details</u></b></td></tr>
    <tr><td width="146">Name:</td>
    <td width="409"><select name="staff" required>
        <option value="">--ALL--</option>
        <?php 
        $sql = "SELECT name FROM staff";
        $result = mysqli_query($connect, $sql);

        while($row = mysqli_fetch_array($result)){
        echo "<option value=\"".$row["name"]."\"";
        if($_POST['name'] == $row['name'])
        echo 'selected';
        echo ">".$row["name"]."</option>";
        }
        ?></select></td></tr> <!--name-->
    <tr><td>SN No:</td>
    <td><?php 
    $sql = "SELECT sn FROM staff WHERE staff = '$staff'";
    $result = mysqli_query($connect,$sql);
    while ($row = mysqli_fetch_array($result))
    {
    $snnum = $row['sn'];
    }
    ?><input type="text" name="sn" value="<?php echo $snnum ?>" required></td></tr><!--sn (staff number)-->

Answer 1

正如凯文在评论中所说，只需将数据属性 sn 设置为选项 select 并使用 select 更改。首先将 sn 设置为这样的数据属性

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

并且我将 jquery 用于 select onchange

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
<script type="text/javascript">
     $(document).ready(function() {
         $('select[name$="staff"]').change(function() {
            var sn = $('select[name$="staff"]').find(':selected').data('sn');
            $('input[name$="sn"]').val(sn);
         });
     });
</script>

这部分 $('select[name$="staff"]').change(function() {}); 它会在 select 更改姓名人员时触发，找到 selected 选项并获取数据属性 sn 并将保存到 var sn 之后用 var sn.

设置 input type name='sn' 的值

代码如下所示

<tr>
    <td width="146">Name:</td>
    <td width="409">
        <select name="staff"  required>
            <option value="">--ALL--</option>
            <?php 
            $sql = "SELECT name,sn FROM staff";
            $result = mysqli_query($connect, $sql);
                while($row = mysqli_fetch_array($result)){
                    echo '<option value="'.$row["name"].'" data-sn="'.$row["sn"].'" > '.$row["name"].' </option>';
                }
            ?>
        </select>
    </td>
</tr> <!--name-->

<tr>
    <td>SN No:</td>
    <td><input type="text" name="sn" value="" required></td>
</tr><!--sn (staff number)-->

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
<script type="text/javascript">
    $(document).ready(function() {
        $('select[name$="staff"]').change(function() {
            var sn = $('select[name$="staff"]').find(':selected').data('sn');
            $('input[name$="sn"]').val(sn);
        });
    });
</script>

如何在 PHP 的下拉菜单中显示我已经 select 的数据？

how to display the data that I already select from drop down menu in PHP?

html

php

mysqli

drop-down-menu