PHP和HTML中的从属下拉列表

时间:2019-06-17 10:56:07

标签: php html mysqli server phpmyadmin

我试图实现一个依赖的下拉列表系统。 contact.php页面中的代码是:

<?php 
    $link = new mysqli("localhost", "root", "", "graphicdesign");
    if($link->connect_error){
        die("ERROR: Nu s-a putut realiza conexiunea la baza de date " .$link->connect_error);
    }

    $resultSet = $link->query("SELECT * FROM orase") or die('Error In Session');
    /* $rowsn = mysqli_fetch_array($resultSet);
    $n_oras=$rowsn['denumire_oras'];
    $id_orasss=$rowsn['id_oras'];    */                                         

    //$resultSetRep = $link->query("SELECT id_oras, denumire_rep FROM reprezentante where id_oras='$id_oras'") or die('Error In Session');                                                  
    //$rows1= mysqli_fetch_array($resultSetRep);
?>

<!DOCTYPE HTML>
<html>

<head>
    --head info
</head>

<body>
    <form action="#">

        <div class="row form-group">
            <div class="col-md-12">
                <label style="margin-right:15px;">Oras</label>
                <select id="denum_oras" name="den_oras">
                    <?php
                        while($rows = mysqli_fetch_array($resultSet)) {
                            $n_oras=$rows['denumire_oras'];
                            $id_oras=$rows['id_oras'];                                              
                            echo "<option value='$id_oras'>$n_oras</option>";
                        }
                    ?>
                </select>
            </div>
        </div>

        <div class="row form-group">
            <div class="col-md-12">
                <label style="margin-right:15px;">Reprezentanta</label>
                <select id="reprez" name="reprez">
                    <?php
                        while($rows2=$resultSet->fetch_assoc()) {
                            $id_oras=$rows2['id_oras'];
                            $den_rep=$rows2['denumire_rep'];

                            $resultSetRep = $link->query("SELECT id_oras, denumire_rep FROM reprezentante where id_oras='$id_oras'") or die('Error In Session');

                            while($rows3=$resultSetRep->fetch_assoc()) {
                                $id_rep = $rows3['id_rep'];
                                $den_rep = $rows3 ['denumire_rep'];

                                echo "<option value='$id_rep'>$den_rep</option>";
                            }
                        } 
                    ?>
                </select>
            </div>
        </div>

    </form>
</body>

</html>

第一个下拉列表正在运行,它正在从数据库的“ orase”表中检索正确的数据: enter image description here

但是对于第二个下拉列表,我希望当我从第一个下拉列表中选择选项“ Braila”时,以外键“ id_oras”作为所选选项显示数据库中的值。

在这种情况下,当我从第一个下拉列表中选择“ Braila”时,表orase中的id_oras = 1,我希望第二个下拉列表从表“ reprezentante”中检索数据,其中id_oras = 1,在这种情况下,检索下拉列表中显示的值“ Rep Braila”和“ Rep Braila 2”,但这没有发生。.

enter image description here

这是页面的捕获: enter image description here

我发布的代码是我想到的最好的代码,但是仍然无法正常工作..请帮助我!

谢谢!

3 个答案:

答案 0 :(得分:0)

PHP是预处理程序语言,无法在运行时进行编译,因此可以使用Ajax或XMLHttpRequest来获取数据。之后,您可以使用Jquery或javascript将数据绑定到选择框中

答案 1 :(得分:0)

您需要使用Ajax来完成此任务。当父下拉列表值更改时,使用onChange jQuery事件将相应地填充子下拉列表或从属下拉列表。

请参考以下链接:Populate a dropdown list based on selection of another dropdown list using ajax

希望这会有所帮助。

答案 2 :(得分:0)

正如其他人所提到的,您将需要在代码中注入一些Javascript。

您的第一个Select看起来不错,但是第二个必须重写。

将onchange事件放入您的第一选择中,如下所示:

<select name="list" id="list" onchange="update(this)">

还有一个Div来保存您的第二个下拉列表。

<div id="secondlist">
    // contents of returned html from "getsecondlist.php" will go here
</div>

然后将以下Javascript放在您的head标签之间。 这将调用“ getsecondlist.php”并传递 idoras 参数。 “ getsecondlist.php”将返回第二个下拉列表,该列表存储在this.responseText中。

<script>
function update(e) {
    idoras = e.options[e.selectedIndex].value;

    var xhttp = new XMLHttpRequest();
    xhttp.onreadystatechange = function() {
        if (this.readyState == 4 && this.status == 200) {
            document.getElementById("secondlist").innerHTML = this.responseText;
        }
    };
    xhttp.open("GET", "getsecondlist.php?idoras=" + idoras, true);
    xhttp.send();
}
</script>

getsecondlist.php

<div class="row form-group">
<div class="col-md-12">
    <label style="margin-right:15px;">Reprezentanta</label> 
    <select id="reprez" name="reprez">
        <?php
        $id_oras=$_GET['idoras'];
        $resultSetRep = $link->query("SELECT id_oras, denumire_rep FROM reprezentante where id_oras='$id_oras'") or die('Error In Session');

        while($rows3=$resultSetRep->fetch_assoc()) {
            $id_rep = $rows3['id_rep'];
            $den_rep = $rows3 ['denumire_rep'];
            echo "<option value='$id_rep'>$den_rep</option>";
        }
        ?>
    </select>
</div>
</div>

$ _ GET ['idoras']获取通过Javascript调用发送的参数。

希望这会有所帮助。