从脚本获取下拉菜单选中值并动态加载数据

<form name="formid">
    <select class="custom-select" name="listid" onchange="getdll(this.value)">
        <option value="0">请选择</option>
        <?php
        // 假设这里通过PHP从数据库动态加载选项
        // $hall_qry = $conn->query("SELECT * FROM `office_hall` WHERE o_id !=0  order by `office_name` asc");
        // while ($row = $hall_qry->fetch_assoc()) : ?>
            <!-- <option value="<?php // echo $row['o_id'] ?>"><?php // echo $row['office_name'] ?></option> -->
        <?php // endwhile; ?>
        <option value="1">办公室A</option>
        <option value="2">办公室B</option>
        <option value="3">办公室C</option>
    </select>
    <br><br>
    <!-- 用于显示选中值的标签 -->
    <label id="lblmess"></label>
</form>

<script>
    function getdll(selectedValue) {
        // 将获取到的值显示在页面上的标签中
        document.getElementById('lblmess').innerHTML = "您选择了: " + selectedValue;

        // 可以在控制台输出，便于调试
        console.log("选中的值是: " + selectedValue);

        // 进一步的逻辑处理，例如：
        // 1. 根据 selectedValue 动态更新其他页面元素
        // 2. 发送 AJAX 请求到服务器，加载与 selectedValue 相关的数据
        //    例如，如果 selectedValue 是一个部门ID，可以加载该部门下的员工列表。
        // updateRelatedDropdown(selectedValue); 
    }

    // 示例：一个可能用于更新第二个下拉菜单的函数（需要通过AJAX从服务器获取数据）
    function updateRelatedDropdown(officeId) {
        // 实际应用中，这里会发起一个AJAX请求到服务器
        // fetch(`/api/getRooms?o_id=${officeId}`)
        //     .then(response => response.json())
        //     .then(data => {
        //         const roomSelect = document.querySelector('select:last-of-type'); // 假设是第二个select
        //         roomSelect.innerHTML = ''; // 清空现有选项
        //         data.forEach(room => {
        //             const option = document.createElement('option');
        //             option.value = room.id;
        //             option.textContent = room.room_name;
        //             roomSelect.appendChild(option);
        //         });
        //     })
        //     .catch(error => console.error('Error loading rooms:', error));
    }
</script>

// api/getRooms.php (服务器端PHP文件)
<?php
// 假设 $conn 已经建立了数据库连接
// header('Content-Type: application/json'); // 设置响应头为JSON

if (isset($_GET['o_id'])) {
    $officeId = $_GET['o_id'];
    // 对 $officeId 进行安全验证和过滤，防止SQL注入
    $officeId = $conn->real_escape_string($officeId); 

    $room_qry = $conn->query("SELECT `id`, `room_name` FROM `assembly_hall` WHERE o_id = '$officeId' ORDER BY `room_name` ASC");
    $rooms = [];
    while ($row = $room_qry->fetch_assoc()) {
        $rooms[] = $row;
    }
    echo json_encode($rooms); // 返回JSON格式的数据
} else {
    echo json_encode(['error' => '缺少参数 o_id']);
}
?>