即时传递变量

时间:2011-06-24 13:55:37

标签: php ajax

我想要实现的是在第一个下拉框中选择后填充第二个Dropbox框。

我不太熟悉AJAX(我相信我需要用它来实现这一点)。

到目前为止,我有以下PHP代码。

<select name="category">
    <?php 
    $q = $admindb->getParentCategories();
    while($row=mysql_fetch_assoc($q)){
        $title=$row['title'];
        $catid=$row['id'];
        ?>
        <option value="<?php echo $catid; ?>"<?php if($catid == $form->value("category")){ echo 'selected="selected"'; }?>><?php echo $title; ?></option>
        <?php
    }   
    ?>
</select>
<select name="subcategory">
    <?php 
    $q = $admindb->getSubCategories($catid);
    while($row=mysql_fetch_assoc($q)){
        $title=$row['title'];
        $catid=$row['id'];
        ?>
        <option value="<?php echo $catid; ?>"<?php if($catid == $form->value("subcategory")){ echo 'selected="selected"'; }?>><?php echo $title; ?></option>
        <?php
    }   
    ?>
</select>

如您所见,我有两个下拉框。

问题是第二个框需要选择第一个才能工作。 所以我需要实现一种将选择从第一个框传递到第二个框的方法。

有人可以提供有关如何执行此操作的任何指示吗?

由于

4 个答案:

答案 0 :(得分:1)

您需要将用于创建第一个和第二个下拉列表的代码隔离到两个单独的PHP文件中。当有人在第一个选择框中选择一个类别时,向生成第二个列表框的文件发出Ajax请求。在请求中包括第一个选择框中的选择。我建议使用jQuery来执行实际的Ajax请求。

答案 1 :(得分:1)

根据数据的来源,您可能需要或可能不需要专门的ajax调用。但是您确实需要捕获事件,然后相应地填充第二个下拉框。最简单的方法是使用jQuery事件:

http://api.jquery.com/category/events/

还有TONES教程。只是谷歌吧。

答案 2 :(得分:0)

所以你将拥有HTML,并且你将使用jQuery(因为它是baller。)

在您的HTML中,您将在两个下拉表单字段中找到<form...>

我将使用简短的伪代码来解释。

$('#first_dropdown').change(function(         
    // When someone makes a change to the drop down or "selects" something (maybe bind click() too)
    // Your code here to select the value selected and do a ...
    $.post() // post to some PHP script that will return the values that will fill the 2nd  
    // dropdown but it'll be stored in some javascript variable
    // and you're going to add jQuery code to take that js variable to populate the 2nd dropdown
){});

答案 3 :(得分:0)

这是一种方法

  • 在php中创建第一个下拉列表并将第二个下拉列表禁用为
  • 到你的第一个下拉列表绑定一个被解雇的JS方法onchange
  • 在PHP中创建一个入口点,返回第二个下拉列表的数据,AJAX将使用此入口点来获取数据
  • 在JS方法中,您已经绑定了第一个下拉列表,使用AJAX获取第二个下拉列表中的数据

现在,您可以使用jQuery,prototype,yui适合您的JS工具包。如果我是初学者,我将从服务器发送标记以响应我的AJAX调用,并将在下拉列表中替换该标记