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項目根據另一個組合框中的選定項目

回答

相關問題