使用php和ajax填充另一个下拉列表

时间:2013-06-30 05:12:50

标签: html ajax drop-down-menu

所以我一直在研究这个观看教程等等,但遇到问题并需要帮助。所以我有一个下拉列表,成功填充另一个下拉列表。问题是我正在创建要填充的第二个下拉列表,但是想要填充现有的下拉列表。如果我没有创建第二个下拉列表并且已经有一个(因此它将填充已存在的第二个下拉列表),有人可以给我任何关于如何执行此操作的建议吗?

这就是我所拥有的:

<!DOCTYPE HTML>
<html>
<head>
</head>
<body>

<form name="form1" action="submit.php" method='POST'>


<select name="country" onchange="window.getStates()">
        <option value="">Select State</option>
        <option value="louisiana">Louisiana</option>
        <option value="texas">Texas</option>
        <option value="alabama">Alabama</option>
        <option value="mississippi">Mississippi</option>
    </select>

    <input type="submit" name="submit" value="Submit">
</form>

<script type="text/javascript">
    function getStates()
    {
        var xmlhttp;
        try{
            xmlhttp = new XMLHttpRequest;
           }catch(e)
           {
            xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
               }

        if(xmlhttp)
            {
                var form = document['form1'];
                var country = form['country'].value;

                xmlhttp.open("GET", "getScools.php?country="+country, true);

                xmlhttp.onreadystatechange = function ()
                {
                    if(this.readyState == 4)
                    {
                        var s = document.createElement("select");
                        s.name= "state";
                        s.innerHTML = this.responseText;

                        if(form['state'])
                        {
                            form.replaceChild(s, form['state']);
                        }else
                            form.insertBefore(s, form['submit']);
                    }
                }                   

                xmlhttp.send(null)
            }
    }

</script>

0 个答案:

没有答案