如何在JavaScript中表示2個父親孩子下拉？

-2

我有2個下拉列表，當用戶選擇下拉＃1時，我需要更新下拉＃2與下拉選擇＃1相關的選項。如何在JavaScript中表示2個父親孩子下拉？

例如

下拉＃1具有汽車製造商：福特，豐田，本田

下拉＃2將針對特定製造商的汽車。

我應該如何去存儲這些數據在javascript中？

我一直希望能創建一個類似字典或散列的集合，這樣我就可以輕鬆地填充每個下拉列表。

我有來自數據庫的實際數據，然後在服務器端我將創建我需要創建此數據結構的JavaScript。

來源

2012-08-23 loyalflow

這可能已經被問過100萬次了。您的搜索功能位於右上角。 – sQVe

[只是一個搜索結果]（http://stackoverflow.com/search?q=populate+a+dropdown+by+javascript+depending+on+another+dropdown）。 –

我不想做一個ajax調用，我想將所有數據客戶端存儲在一個javascript對象中，我在問如何構造這些數據。 – loyalflow

從您的評論 I don't want to make an ajax call, I want to store all the data client side in a javascript object, I am asking how to structure that data

所以只是一個想法

HTML

<select id="cars_company"> 
    <option value="ford">Ford</option> 
    <option value="toyota">Toyota</option> 
</select> 

<select id="cars"> 
    <option value="ford_car_one">Ford Car One</option> 
    <option value="ford_car_two">Ford Car Two</option> 
</select>

$(function(){ 
    cars={ 
     ford:{ 
      ford_car_one:'Ford Car One', 
      ford_car_two:'Ford Car Two' 
     }, 
     toyota:{ 
      toyota_car_one:'Toyota Car One', 
      toyota_car_two:'Toyota Car Two' 
     } 
    }; 

    $('#cars_company').on('change', function(){ 
     $('#cars').html(''); 
     $.each(cars[$(this).val()], function(k, v){ 
      $('<option></option>').val(k).text(v).appendTo($('#cars')); 
     }); 
    }); 
});

DEMO。

來源

2012-08-23 19:53:19

通過下拉式我想你是指一個選擇框。最好的方法是使用靜態JavaScript，但讓它執行ajax調用來獲取數據。第一個選擇框已經填充了html中的數據（可以使用數據庫中的數據構建服務器端腳本）。在第一個選擇框的更改事件中，您將使ajax調用發送值並且根據您的服務器發回第二個選擇框的數據。比用一點點jQuery，你可以用檢索到的數據填充第二個選擇框。這是一個安靜的情況下COMON，所以你應該能夠找到一些嘖嘖網上，如果你需要......

來源

2012-08-23 19:24:34 Pevara

我不想做一個ajax調用，我沒有那麼多的選項，所以我可以在第一次加載頁面的時候將它存儲在所有的客戶端。 – loyalflow

你說你有服務器端腳本以及JavaScript，所以我不明白你爲什麼不能做一個Ajax調用。但是，您確實可以將第二個選擇的所有數據發送到javascript中，並將其存儲爲多維數組。你會發送大量的數據，你永遠不會使用，雖然... – Pevara

它導致東西減速無故，它不是我所說的數據的分配。 ddl＃1 5項，ddl＃2總共20項。 – loyalflow

如何在JavaScript中表示2個父親孩子下拉？

回答

相關問題