Combobox项目根据另一个组合框中的选定项目

如果我有一个combobox1有项目：水果&蔬菜。Combobox项目根据另一个组合框中的选定项目

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

如果combobox1中的所选项目是Fruits，那么combobox2项目是：apple，orange ..等等。

如果combobox1所选择的项目是vegetables，然后combobox2项目有：萝卜，lettuce..etc。

我该如何使用PHP & HTML？（请考虑“PHP & HTML”作为条件）。

来源

2011-12-03 Aan

不幸的是你的条件（PHP只& HTML，JavaScript不）意味着你应该重新载入页面/加载一个表单提交的另一个页面上的组合框每次更改后，因为这将是只有这样，您才能理解选择的值是什么，因为您决定只使用服务器端（PHP）。

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

来源

2011-12-03 22:22:43 danicotra

你可以这样做：

<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) ; 
    }

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

来源

2011-12-03 20:06:31

@Andry Knupp：我不熟悉'ajax'，我的工具只有PHP和HTML ..任何建议？ – Aan

代码已经准备就绪，你只需要研究它 – 2011-12-03 20:12:44

@Andry Knupp：不能仅仅使用HTML和PHP来完成吗？请把它当作一个条件。不幸的是， – Aan

为此，您可以使用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>

来源

2011-12-03 20:15:31

Combobox项目根据另一个组合框中的选定项目

回答

相关问题