下拉菜单自动选择一个值

Question

我需要帮助解决这个问题。 我想进行动态下拉菜单，当我从一个下拉菜单中选择一个值为“A”时，另一个下拉列表将设置为“B”。

我有一个像这样动态下拉的javascript函数。

<script type="text/javascript">
function coba(){
        document.getElementById("add").innerHTML +=
  " <inputclass='department_name' type='text' 
   size='50' />";
  }
 </script>

Answer 1

参考：how to dynamically change item of two related combobox

简而言之：

1. 在CognitoIdentityServiceProvider中，检索mysql file1.php并将其显示在组合框 A 中。
2. 在更改组合框 A 时，获取选项的值并通过ajax传递一个php文件tbl1并显示由file2.php生成的file1.php的输出{1}}。
3. 在file2.php中，使用Ajax传递的ID检索mysql file2.php并生成一个组合框 B 。

示例：

<强>的index.php

tbl2

<强> ajax_display.php

<script type="text/javascript">
function GetXmlHttpObject()
{
    if (window.XMLHttpRequest)
    {
        return new XMLHttpRequest();
    }
    if (window.ActiveXObject)
    {
        return new ActiveXObject("Microsoft.XMLHTTP");
    }   
    return null;
}

function ajax_function(url, postData, id)
{
    xmlhttp=GetXmlHttpObject();
    xmlhttp.open("POST", url, true);
    xmlhttp.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
    xmlhttp.setRequestHeader("Content-length", postData.length);
    xmlhttp.setRequestHeader("Connection", "close");
    xmlhttp.onreadystatechange=function()
    {
        if(xmlhttp.readyState==4)
        {
            document.getElementById(id).innerHTML=xmlhttp.responseText;                            
        }       
    }                
        xmlhttp.send(postData);
}

function dispSecond(Id)
{
    var params  = 'Id=' + Id ;
    var DivId = 'dispDiv';
    ajax_function('ajax_display.php', params, DivId);
}

</script>

<?php
/* Mysqli query to retrieve and store in $ArrayList(Id=>Text)
   Example:  $ArrayList = array(1=>'Ford',2=>'Chevy');
*/
?>

<select id="drop_first" name="drop_first" onchange="return dispSecond(this.value);">
<option value="0">[Select]</option>
<?php
foreach ($ArrayList as $k=>$v)
{
echo '<option value="'.$k.'">'.$v.'</option>';  
}
?>
</select>

<div id="dispDiv"></div>

注意：

使用Mysqli或PDO代替mysql

下面的演示和下载基于数组，您可以使用mysqli检索来实现。

此外，您可以尝试使用$ .ajax，这也更容易。

DEMO | DOWNLOAD