2013-09-25 131 views
1

我有兩個下拉菜單,第一個列出像[--All--,Group1,Group2,Group3等]的值,第二個默認應該列出所有的值。如果我們從第二組中選擇組1,應只列出那些相關的值。我們如何在jquery & html ..中存儲數據庫。Jquery根據第一個下拉菜單顯示/排序第二個下拉菜單?

+0

你有什麼累?請發佈與yopur相關的代碼.. – bipen

+0

看起來像這個重複... http://stackoverflow.com/a/18352194/217757 –

+0

你也可以在這裏使用這個插件... http://bit.ly/16pIifR –

回答

1

您可以嘗試something like this(使用data-

HTML:

<select id="groups"> 
    <option value='--All--'>--All--</option> 
    <option value='Group1'>Group1</option> 
    <option value='Group2'>Group2</option> 
    <option value='Group3'>Group3</option> 
</select> 

<select id="sub_groups"> 
    <option data-group='all' value='0'>--Select--</option> 
    <option data-group='Group1' value='one'>one</option> 
    <option data-group='Group1' value='two'>two</option> 
    <option data-group='Group2' value='three'>three</option> 
    <option data-group='Group2' value='four'>four</option> 
    <option data-group='Group3' value='five'>five</option> 
    <option data-group='Group3' value='Six'>six</option> 
<select> 

JS:

$('#groups').on('change', function(){ 
    var val = $(this).val(); 
    var sub = $('#sub_groups'); 
    if(val == '--All--') { 
     $('#sub_groups').find('option').show(); 
    } 
    else { 
     sub.find('option').not(':first').hide(); 
     $('option', sub).filter(function(){ 
      if($(this).attr('data-group') == val){ 
       $(this).show(); 
      } 
     }); 
    } 
    sub.val(0); 
}); 
+0

酷,我已經做到了,我猜也是這樣!謝謝回覆。 – adgfx

+0

不客氣:-) –

相關問題