Question

你如何根据基于PHP的网络表单中下拉1中所做的选择来更新下拉列表2的内容？

非常感谢任何代码示例。

非常感谢！

Answer 1

你将不得不使用AJAX，我会推荐jQuery的抽象。

e.g。

<select id="sel1">
   <option value="1">1</option>
   <option value="2">2</option>
</select>
<select id="sel2">
</select>
<script type="text/javascript">
$('#sel1').change(funciton(){
   $.ajax({url: 'fetchSel2.php',
           data:{sel1:$('#sel1').val()},
           success:function(data){
               $('#sel2').html(data);
           }
          });
});
</script>

这假设有一个'fetchSel2.php'可以为第二个选择提供选项。

e.g。

function getSecondOptions($sel1){
    $r=mysql_query(RELEVANT_QUERY);
    $opts='';
    if($r && mysql_num_rows($r)>0){
        while(list($label,$val)=mysql_fetch_row($r)){
            $opts.='<option value="'.$val.'">'.$label.'</option>';
        }
    }
    return $opts;
}

if(isset($_GET['sel1'])){
    echo getSecondOptions($_GET['sel1']);
}
exit;

Answer 2

对于实时更新，您需要使用AJAX并需要启用JS的浏览器。如果用户浏览器不支持JS或JS被禁用，则唯一的选择是提交表单并使用第二个下拉列表中的更新选项重新加载整个页面。如果你想让JS代码执行AJAX，你能不能告诉我你要使用的JS库，所以我可以相应地提供代码。

Answer 3

您正在寻找的是级联下拉列表。这是使用每个下拉列表按顺序触发的AJAX完成的。以下是Google的一个示例（http://codestips.com/php-ajax-cascading-dropdown-using-mysql/），请注意我不赞同这个链接，这只是第一个合理的结果。

Answer 4

我最近使用jQuery http://jsfiddle.net/tBrXt/1/

做了这个

Answer 5

您有以下选择：

如果您不希望表单刷新和更新部分，请使用AJAX 表格。
如果你不想使用ajax而且可以忍受整个刷新表单，您可以使用捕获下拉列表的onChange事件的JavaScript。
如果用户没有启用javascript，则以上2种方法将失败。因此，最好包含一个用户可以点击的按钮，这将要求PHP方面重新呈现表单。

我个人的偏好是使用最后一种方法作为没有启用javascript的人的后备。然后使用第一种方法（AJAX）逐步增强具有javascript的那些表单。

下拉表单中的实时更新

5 个答案: