基于另一个组合框中选定项目的组合框项目答案

【问题标题】：Combobox items based on selected item in another combobox基于另一个组合框中选定项目的组合框项目
【发布时间】：2015-07-27 19:41:46
【问题描述】：

如果我有 combobox1 有以下项目：水果和蔬菜。

我需要根据combobox1 中的选定项显示另一个combobox2。

如果combobox1中选中的项目是Fruits，那么combobox2项目是：苹果、橙子……等

如果combobox1中选中的项目是vegetables，那么combobox2的项目是：萝卜、生菜..等。

如何使用 PHP 和 HTML 做到这一点？（请考虑“仅限 PHP 和 HTML”作为条件）。

【问题讨论】：

标签： php html combobox

【解决方案1】：

不幸的是，您的条件（仅限 PHP 和 HTML，而不是 javascript）意味着您应该在每次更改组合框后重新加载页面/加载另一个页面并提交表单，因为这是您了解什么是选择值，因为您决定只在服务器端 (PHP) 工作。

如果您决定不使用 javascript（或 jQuery 等 javascript 框架），您将无法在不提交表单的情况下修改页面中的内容，因此您将无法更改第二个组合框元素如果您没有提交第一个组合框选择。

【讨论】：

【解决方案2】：

你可以这样做：

<html>
    <head>
        <script type="text/javascript" src="http://code.jquery.com/jquery.min.js"></script>
        <script type="text/javascript">
            $(function(){
                $('#combo').change(function(){
                    console.log($(this));
                    $.get( "ABC.php" , { option : $(this).val() } , function ( data ) {
                        $ ( '#comboB' ) . html ( data ) ;
                    } ) ;
                });
            });
        </script>
    </head>
    <body>
        <div id="comboBox">
            <fieldset>
                <form>
                    <select name="combo" id="combo">
                        <option value="">-- Select</option>
                        <option value="1">Fruits</option>
                        <option value="2">Vegetables</option>
                    </select>
                    <select name="comboB" id="comboB">
                        <option value="">--</option>
                    </select>
                </form>
            </fieldset>
        </div>
    </body>
</html>

然后在 PHP 页面中，您会得到一个包含要添加到下拉框的数据的数组，当然您还必须发送一个 ajax 调用来填充下拉框，然后在 php 页面中，您有以下：

<?php
    $Options = Array ( 
        1 => Array ( 
            'Apple' ,
            'Orange'
        ) , 
        2 => Array ( 
            'Radish' ,
            'Lettuce'
        )
    ) ; 

    forEach ( $Options [ $_GET [ 'option' ] ] as $Item ) {
        printf ( '<option value="%s">%s</option>' , $Item , $Item ) ;
    }

现在，您只需要调整验证......等等。

【讨论】：

@Andry Knupp：我不熟悉ajax，我的工具只有 PHP 和 HTML.. 有什么建议吗？
@Andry Knupp：不能仅使用 HTML 和 PHP 完成？请考虑将其作为条件。

【解决方案3】：

你可以使用 jquery 来做到这一点

例如：

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.0/jquery.min.js" type="text/javascript" ></script>

<select class="small-input" id="NameCombobox1" name="NameCombobox1">                            
    <option value="0">Select one</option>
    <option value="1">Fruits</option>
    <option value="2">vegetables</option>
</select>

<div id="result"></div>

<script type="text/javascript">

 $('#NameCombobox1').change(function() 
    {                                   
    var NameCombobox1 =  $(this).attr('value'); 

    if( NameCombobox1> 0) {
    $.post(
    "PageWithSelect.php", 
    { BRFLink:  NameCombobox1 },
    function(data) {                                                        
        $("#result").append(data);          
    }, 
     "html"
    );
    }
    $('#result').show();
  });

</script>

【讨论】：