来自 MySQL 的多个嵌套下拉菜单

Question

我有以下 php 页面，其中四个下拉列表正确填充了四个不同的 mysql 查询。我会根据 CATEGORIES_1.c_id 通过查询填充 Categories_2 以及其他嵌套的下拉列表。

试图调用 myFunction() onChange，但似乎不起作用。我没有收到警报。

有谁知道我该怎么做？任何帮助将不胜感激。

我知道我必须使用 mysqli 但它是一个现有页面，我稍后再做。

<script>
var myDropdown=document.getElementsByName('cat1')[0];
function myFunction(){
    alert('option changed : '+myDropdown.value);
}
</script>



<form enctype="multipart/form-data" method="post" action="import.php">

        <label for="cat_name">Categories_1</label>
        <select name = "cat1" onChange="myFunction()">
        <?php
            $s = mysql_query("SELECT * FROM `CATEGORIES_1`");
            while($row = mysql_fetch_assoc($s)) {
            echo ('<option value="' . $row['c_id'] . '">' . $row['c_name'] . '</option>'); } ?>
        </select>
        <br>            

        <label for="cat_nam">Categories_2</label>
        <select>
        <?php
            $s = mysql_query("SELECT c_name FROM `CATEGORIES_2`");
            while($row = mysql_fetch_assoc($s)) {
            echo ('<option value="0">' . $row['c_name'] . '</option>'); }            ?>
        </select>
        <br>            

        <label for="cat_nae">Categories_3</label>
        <select>
        <?php
            $s = mysql_query("SELECT c_name FROM `CATEGORIES_3`");
            while($row = mysql_fetch_assoc($s)) {
            echo ('<option value="0">' . $row['c_name'] . '</option>'); } ?>
        </select>
        <br>            

        <label for="cat_ame">Categories_4</label>
        <select>
        <?php
            $s = mysql_query("SELECT c_name FROM `CATEGORIES_4`");
            while($row = mysql_fetch_assoc($s)) {
            echo ('<option value="0">' . $row['c_name'] . '</option>'); }            ?>
        </select>

Answer 1

调用下拉值的方法是错误的

var myDropdown=document.getElementsByName('cat1')[0];

您的 myFunction 将是

<script>
function myFunction(){
var myDropdown=document.getElementById('cat1');
  var myDropdowval= myDropdown[myDropdown.selectedIndex].value;
   alert(myDropdowval);
}
</script>

在这里您将 id id="cat1" 分配给您的下拉列表

 <select name = "cat1" id="cat1" onChange="myFunction()">
    <?php
    $s = mysql_query("SELECT * FROM `CATEGORIES_1`");
    while ($row = mysql_fetch_assoc($s)) {
        echo ('<option value="' . $row['c_id'] . '">' . $row['c_name'] . '</option>');
    }
    ?>
</select>

Answer 2

使用 ajax 调用和不同的 php 页面生成基于 AJAX 调用的响应，将选定的下拉 ID 作为参数发送到 php 页面。并将传入的响应设置为您下面的下拉菜单。如果您使用 Jquery 然后使用

 $('[name=cat1]').val()

Answer 3

<select id="myselect">
    <option value="1">Mr</option>
    <option value="2">Mrs</option>
    <option value="3">Ms</option>
    <option value="4">Dr</option>
    <option value="5">Prof</option>
</select>

alert($( "#myselect option:selected" ).text());

这里正在工作JSFIDDLE

Answer 4

你需要使用 ajax ..我希望这对你有帮助..

JS

$(document).ready(function(){
    $(document).on('change','#cat1',function(){
        $.ajax({
            cache: false,
            url: 'getSecondSelect.php',
            type: 'post',
            data: 'input=' + $(this).val(),
            success: function(data){
                $('#cat2').html(data)
            }
        })
    })
}

表格

<form enctype="multipart/form-data" method="post" action="import.php">
    <label for="cat_name">Categories_1</label>
    <select id="cat1" name="cat1">
    <?php
        $s = mysql_query("SELECT * FROM `CATEGORIES_1`");
        while($row = mysql_fetch_assoc($s)) {
        echo ('<option value="' . $row['c_id'] . '">' . $row['c_name'] . '</option>'); }
    ?>
    </select>
    <br />

    <label for="cat_name">Categories_2</label>
    <select id="cat2" name="cat2"></select>
    <br />

getSecondSelect.php

$s = mysql_query("SELECT c_name FROM `CATEGORIES_2` WHERE CATEGORIES_1.c_id='".$_POST['input']."'");
while($row = mysql_fetch_assoc($s)) {
echo ('<option value="0">' . $row['c_name'] . '</option>'); }

来自 MySQL 的多个嵌套下拉菜单

Multiple nested dropdown menu from MySQL

javascript

php

mysql

drop-down-menu