在第一个下拉菜单中通过用户输入更改第二个下拉菜单中的选项

时间:2013-09-16 14:11:05

标签: php jquery mysql

感谢您花时间看看这个。

我有两个下拉菜单。第一个是客户列表,第二个是项目列表。

所有项目都只与一个客户端绑定,因此我希望代码能够获取客户端的用户输入,然后读取该值,并修改PHP代码以仅打印出第二个drop中的值与所选客户端对应的下拉菜单。

这里有一些代码。对于第一个下拉菜单:

     <div class="item">
                <label for='clSel' id='tsClLabel'>Client:</label>
                <select name='clSel' id='wClient' onChange="bGroup();">
                    <option></option>
                    <?php
                    $cQuery = "SELECT * FROM Clients ORDER BY Client_Name";
                    $cResult = mysql_query($cQuery);
                    while($cData = mysql_fetch_assoc($cResult)) {
                        echo '<option id="Cid" value="'.$cData['Id'].'">'.$cData['Client_Name'].'</option>';
                    }
                    ?>
                </select>

这是我的jQuery函数,用于从第一个下拉列表中获取用户选择的值:

           <script>
            function bGroup(){
                val1 = $("#wClient").val();
               // window.alert(val1);
              //  $('#div1').html(val1);
                return val1;
            }
        </script>

第二个下拉菜单的代码:

                <label for='billGroupId'>Billing Group: </label>
                <select name='billGroupId'>
                    <option value=''></option>
                    <?php
                        $sql = "SELECT * FROM Billing_Groups ORDER BY Client_Id, Name";
                        $sth=$dbh->prepare($sql);
                        $sth->execute();
                        while ($row = $sth->fetch())
                        {
                            if ($row['Name']!= ''){
                                echo "<option value='".$row['Id']."' > ".$row['Name']."</option>";
                                echo "<script> bGroup(); </script>"
                            }
                        }
                    ?>
                </select>

我知道我需要在第二个下拉菜单中包含 WHERE语句

基本上Select * FROM Clients WHERE Client_ID == $jsVAR

我已经在var1 JavaScript变量中拥有了我需要的值。如何通过PHP读取或通过JS代码将这些小数据发送到PHP?

谢谢!

2 个答案:

答案 0 :(得分:0)

棘手的, 你有一个选择。一种方法是在获得第一级选择时使用Ajax获取第二级菜单结构,并在成功后填充第二级。这可能是一个问题,因为在发生这种情况时可能会出现某种网络延迟,而您无法控制(除非您处于封闭环境中)。因此,从用户的角度来看,它可能是反直觉和迟钝的感觉,尤其是在连接速度慢或共享托管解决方案时,时间可能会有很大差异。

另一种方法是以某种方式提取所有可能的值并使用jQuery过滤它们(因此隐藏那些不适用的值),可能使用类或其他属性作为过滤数据的方法。使用jQuery,您可以将数据分配给元素,这样您也可以使用它。如果有大量数据(从你描述的场景中无法分辨),第二种方法可能不太好。看看你的第二级代码,我没有看到WHERE条件,所以我不确定第一级的值是如何影响第二级的,所以很难知道如何处理这个方法。< / p>

答案 1 :(得分:0)

您可以SELECT来自数据库的所有记录,然后使用json_encode()将其插入到页面HTML中。这样的事情:

<?php
$sql = "SELECT * FROM Billing_Groups ORDER BY Client_Id, Name";
$sth=$dbh->prepare($sql);
$sth->execute();
$projectData = array();
while ($row = $sth->fetch())
{
    if ($row['Name']!= ''){
        $projectData[$row['Client_Id']][] = $row;
    }
}
echo '<script type="text/javascript">var projects=', json_encode($projectData), ';</script>';
?>

然后,在你的JS中,你使用变量projects作为关联数组(对象),例如:

<script type="text/javascript">
for (p in projects[clientId]) {
    alert(projects[p].Name);
}
</script>