Question

之前我没有使用太多的Ajax，这看起来很简单。我有拼图的单独部分，但不知道如何将它们放在一起。

这两个下拉列表都是从数据库中填充的，第一个下拉列表是使用以下代码填充的：

<?php
$sql = "SELECT title, nid FROM node where type= 'hotel'";
$hotels = mysql_query($sql);
?>
<select name="hotels" id="hotels">
<?php
while($row = mysql_fetch_array($hotels))
{
  echo "<option value=\"".$row['nid']."\">".$row['title']."\n  ";
}
?>
</select>

应根据上面选择的值填充第二个下拉列表。所以基本上我想获取所选项目的ID，然后在查询中使用它来填充第二个下拉列表。

我会使用上面的代码，但SQL查询的代码如下：

SELECT title, nid from node where type = 'season' AND hotel_nid = X

其中X是第一个下拉列表中selectedIndex的id。

虽然代码在那里工作，我不知道如何将两者结合起来。我可以使用Javascript通过打印代码来修改名为“seasons”的div的InnerHTML来检索和显示下拉列表。

但是有更好的方法可以让两个下拉菜单都可见，但是第二个是在第一个完成后被禁用的吗？

Answer 1

您可以使用填充innerHTML框的<select>而不是<div>，但我建议您查看jQuery：http://api.jquery.com/category/ajax/。它使一切变得更加容易。

Answer 2

当用户更改第一个下拉列表的值时，应通过Ajax调用填充第二个列表的PHP脚本。所以你应该添加onchange =“myFunctionToPopulate（this.value）;”到第一个下拉列表。

如果您不知道该怎么做，我建议您使用jQuery这样的JS库，我们将为您发布简单的代码来实现这一目标。

<强>被修改

使用jQuery，你可以这样做：

<select name="first_dropdown" onchange="$('#dropdown2_container').load('your_script.php?nid='+this.value);">
  <option....
</select>
...
<div id="dropdown2_container" style="display:none"> </div>

your_script.php将返回整个select标记。

Ajax方法根据第一个选择填充第二个动态下拉列表

2 个答案: