使用 PHP 的 HTML 中的下拉列表答案

【问题标题】：Dropdown list in HTML using PHP使用 PHP 的 HTML 中的下拉列表
【发布时间】：2021-04-04 17:58:48
【问题描述】：

我需要从大学选择中获取 UniversityID 来列出这所大学中的学院以进行学院选择。我读到使用 AJAX 很容易，但我无法解决它。目前研究所选择显示所有研究所。

Institute_1 和 Institute_2 在 University_1
Institute_3 在 University_2

如果用户选择 University_1
或
Institute_3Institute_1 和 Institute_2 /em> 如果用户选择 University_2

如何编写 AJAX 部分或有什么更好的方法？

<label>University</label>
    <select name="University" id="University">
    <?php
    $sql = "SELECT * FROM University";
    $stmt = sqlsrv_query( $conn, $sql);
    if( $stmt === false ) {
        die( print_r( sqlsrv_errors(), true));
    }
    while( $row = sqlsrv_fetch_array( $stmt, SQLSRV_FETCH_ASSOC) ) {
    ?>
    <option value="<?php echo $row['UniversityID']; ?>"><?php echo $row['University_NAME']; ?></option>
    <?php } ?>
    </select>
    <br>

    

    <label>Institute</label>
    <select name="Institute" id="Institute">
    <?php
    $sql = "SELECT * FROM Institute ";
    $stmt = sqlsrv_query( $conn, $sql);
    if( $stmt === false ) {
        die( print_r( sqlsrv_errors(), true));
    }
    while( $row = sqlsrv_fetch_array( $stmt, SQLSRV_FETCH_ASSOC) ) {
    ?>
    <option value="<?php echo $row['InstituteID']; ?>"><?php echo $row['Institute_NAME']; ?></option>
    <?php } ?>
    </select>
    <br>

【问题讨论】：

当你选择的大学发生变化（比如调用一个PHP文件）时，你应该触发一个ajax，它将查询结果返回到学院选择框上的部分。（您想要一些示例代码还是想自己尝试一下？）
你想在选择选项中显示 Institute 在选择选项中更改 university 的内容？？
请也向我们展示您的数据库表结构，university id 存在于institute table。
@KUMAR 是的，在机构表中还有大学 ID。
请看我对示例代码的回答

标签： php html ajax dropdown html-select

【解决方案1】：

您可以尝试以下示例代码来实现您想要的（Ajax 调用）：

HTML（请将此文件放在网络服务器中运行）

<script
  src="https://code.jquery.com/jquery-3.5.1.js"
  integrity="sha256-QWo7LDvxbWT2tbbQ97B53yJnYU3WhH/C8ycbRAkjPDc="
  crossorigin="anonymous"></script>
  
<label>University</label>
<br>
    <select name="University" id="University" onchange="javascript:trigger1();">
    <option value="">Please select</option>
    <option value="UID01">MIT</option>
    <option value="UID02">Harvest University</option>
    <option value="UID03">Stanford University</option>
    </select>
    <br>

    

<label>Institute</label>
<div id=result>
<select name=Institute id=Institute>
<option value="">Please select University First
</select>
</div>


<script>
function trigger1()
{
var1=document.getElementById("University").value;
//alert(var1);



$.ajax({
 method: 'POST',
url: 'http://www.createchhk.com/getfaculty.php?uid='+var1,
    success: function(response){
        document.getElementById("result").innerHTML=response;
    },
    error: function (request, status, error) {
        console.log("There was an error: ", request.responseText);
    }
  })
}
</script>

PHP (getfaculty.php)

<?php if ($_REQUEST["uid"]=="UID01") { ?>
<select name="Institute" id="Institute">
<option value="Arts">Arts
<option value="Science">Science
<option value="Medicine">Medicine
<option value="Engineering">Engineering
</select>
<?php } ?>

<?php if ($_REQUEST["uid"]=="UID02") { ?>
<select name="Institute" id="Institute">
<option value="BBA">BBA
<option value="Arts">Arts
<option value="Science">Science
<option value="Medicine">Medicine
<option value="Engineering">Engineering
</select>
<?php } ?>


<?php if ($_REQUEST["uid"]=="UID03") { ?>
<select name="Institute" id="Institute">
<option value="Music">Music
<option value="Science">Science
<option value="Medicine">Medicine
<option value="Engineering">Engineering
</select>
<?php } ?>

【讨论】：