在javascript / php / html中选择第一个下拉列表后更新第二个下拉列表

时间:2013-07-27 19:21:54

标签: php javascript html

我需要一个示例,可以让我在选择第一个下拉列表后填充第2,第3,......,第7个下拉列表(所有相同的条目)。我在HTML头之前将所有值存储在PHP中的数组中。

我看过一些例子,但找不到具体的解决方案

例如: 假设我在上述特许经营商下面有一个装满特许经营商和销售点的仓库,我需要为具有n个销售点的特定特许经营商提前7天创建订单。我的解决方案是用户/仓库运营商会选择一个特许经营商,然后第二个(最多7个)下拉列表会有那些被选中的特许经营者的网点。

感谢。


<?php
$productClass = new product();
$productClass->setProductList();

$franchiseeClass = new users();
$franchiseeClass->getAndSetAllFranchisees();
$franchiseeArray = $franchiseeClass->getUserList();

$operatorOutletClass = new users();
$operatorOutletClass->getAndSetUserByLevel("5");

?>

<html><head></head><body>

<div align="center">
    <form name="BBOFranchisee" method="post" action="?" onSubmit="return checkSubmit()">
        <table align="center" border="1">
            <tr>
                <td>
                    Franchisee: 
                </td>
                <td colspan="8">
                    <select name="displayFranchisee" size="1" onChange="populateOutlet('findOutletByFranchisee.php?fid='+this.value)">
                        <option label="franchisees" value="0">--Choose Franchisee--</option> 
                        <?php 
                        for($i=0;$i<count($franchiseeArray);$i++)
                        { 
                            foreach($franchiseeArray[$i] as $key => $val)
                            {
                                echo "<option label=\"franchisees\" value=\"$key\">$val</option>\n";
                            }             
                        } ?>
                    </select>
                </td>
            </tr>
<tr>
                <?php for($j=0;$j<7;$j++) { ?>
                <td>
                    Outlet:
                    <select name="displayOutlet<?php echo $j; ?>" size="1">
                        <option label="outlets" value="0">&nbsp;</option> 
                    </select>
                </td>
                <?php } ?>
            </tr>
</body>
</html>

我想延续是javascript部分..我试着看看http://roshanbh.com.np/2007/12/change-dropdown-list-options-values-from-database-with-ajax-and-php.html提供的解决方案,但它不能用于多个下拉。

1 个答案:

答案 0 :(得分:0)

为了使用该javascript示例,您需要为第2至第7选择添加ID - id="displayOutlet<?php echo $j; ?>"

<?php for($j=0;$j<7;$j++) { ?>
      <td>
          Outlet:
          <select name="displayOutlet<?php echo $j; ?>" id="displayOutlet<?php echo $j; ?>"size="1">
               <option label="outlets" value="0">&nbsp;</option> 
          </select>
      </td>
<?php } ?>

然后在你的javascript代码中,你可以为第二至第七选择添加一个循环。

if(req.status == 200) { // which represents ok status 
    for(var i=0;i<7;i++){
        document.getElementById('displayOutlet'+i).innerHTML=req.responseText;
    }      
}
相关问题