Question

我的php / html页面中有3个下拉菜单（我正在使用jooomla 3x和jumi将脚本文件放入我的文章中）表单正在从MySQL数据库表填充。

表单中的动作属性是将表单发送到第二页，其中包含感谢信息并向管理员和用户发送电子邮件（再次使用jumi来实现此目的）。可能会改变这种逻辑 - 如果没有其他办法（这将是长期工作）。所以，目前我不能使用表单的自我动作事件属性。

我成功地从MySQL数据库表中成功填充了第一个下拉列表（下面的代码）。

我还设法使用jquery在html中获取div中第一个下拉选择值 - 但是，如何在第一个下拉列表触发的onchange事件上级联相同的逻辑？没有刷新整个页面并丢失所有以前的表单选择？

这是我的代码

      <script type="text/javascript"> window.onload = function(){
            document.getElementById('make').addEventListener('change',function(){
                var $strmake = document.getElementById("make").value;
                //alert($strmake);
                document.getElementById("div1").innerHTML = $strmake;
            });
        }

My First Drop Down正常工作

                <select name="make" id="make" style="font-size:1.3em;padding:5;height:40px;">
            <option selected>Select Make</option>
            <?php
                // credentials
                $host_name  = xxx
                $database   = xxx
                $user_name  = xxx
                $password = xxx


                $connect = mysqli_connect($host_name, $user_name, $password, $database) or die("Error " . mysqli_error($connect));
                if (mysqli_connect_errno())
                {
                    echo "Failed to connect to MySQL: " . mysqli_connect_error();
                }
                else {
                    echo "Connected to MySQL<br>";
                }

                //execute the SQL query and return records
                $query = "SELECT distinct make FROM VehicleModelYear ORDER BY make";

                $result = mysqli_query($connect, $query); 

                //fetch tha data from the database 
                while($row = mysqli_fetch_array($result)) { 
                  echo "<option value='" . $row['make'] . "'>" . $row['make'] . "</option>"; 
                } 
            ?>
            </select>

第二个下拉代码

                <SELECT name="model" class="" id="model" style="font-size:1.3em;padding:5;height:40px;">
            <OPTION selected>Select Model</OPTION>
            <?php

                $connect = mysqli_connect($host_name, $user_name, $password, $database) or die("Error " . mysqli_error($connect));
                if (mysqli_connect_errno())
                {
                    echo "Failed to connect to MySQL: " . mysqli_connect_error();
                }
                else {
                    echo "Connected to MySQL<br>";
                }

                $selected = explode(',', $_POST['make']);
                $s_id = $selected[0];
                $s_name = $selected[1];

                //execute the SQL query and return records
                $query = "SELECT distinct model FROM VehicleModelYear where ????? ORDER BY model";

                $result = mysqli_query($connect, $quer2); 

                //fetch tha data from the database 
                while($row = mysqli_fetch_array($result)) { 
                  echo "<option value='" . $row['model'] . "'>" . $row['model'] . "</option>"; 
                } 
            ?>
            </SELECT>

希望如果我有第二个解决方案，我将获得第三个？

提前致谢...

Answer 1

您好我不知道jquery但是我会使用简单javascript与ajax首先让我们创建ajax来电<\ n} / p>

<script type="text/javascript">
    function getMake(make){
 var data = new XMLHttpRequest();
data.open("POST","make.php");

data.onreadystatechange = function(){
  if(data.readyState === 4 && data.status === 200){
    document.getElementById('model').innerHTML = data.responseText;

  }
}
data.setRequestHeader("Content-Type","application/x-www-form-urlencoded");
data.send('make='+make);
}
</script>

创建model.php文件

<?php

            $connect = mysqli_connect($host_name, $user_name, $password, $database) or die("Error " . mysqli_error($connect));
            if (mysqli_connect_errno())
            {
                echo "Failed to connect to MySQL: " . mysqli_connect_error();
            }
            else {
                echo "Connected to MySQL<br>";
            }
            $make = $_POST['make']
            $selected = explode(',', $make);
            $s_id = $selected[0];
            $s_name = $selected[1];

            //execute the SQL query and return records
            $query = "SELECT distinct model FROM VehicleModelYear where ????? ORDER BY model";

            $result = mysqli_query($connect, $quer2); 

            function createDropDown($result){
            echo '<OPTION selected>Select Model</OPTION>';
            //fetch tha data from the database 
            while($row = mysqli_fetch_array($result)) { 
              echo "<option value='" . $row['model'] . "'>" . $row['model'] . "</option>"; 
            } 
            }
           createDropDown($result); //calling the function
        ?>

然后在你的第一个dropdwon做下面的

<select name="make" id="make" style="font-size:1.3em;padding:5;height:40px;" onchange="getMake(this.value)">

将您的第二个下拉列表更改为

<SELECT name="model" class="" id="model" style="font-size:1.3em;padding:5;height:40px;"></SELECT>

填充onchange事件的第二个下拉列表

1 个答案: