2013-10-10 61 views
0

過濾正在運行,但我需要使用這兩個選擇下拉菜單選擇所有菜單。 我需要的是兩個選擇下拉列表中有一個全選。使用日期過濾所有下拉菜單到下拉菜單

HTML:

<select name="select1" id="select1"> 
<option Value="">All</option> 
     <option Value="2013-10-10">2013-10-10</option> 
     <option Value="2013-10-09">2013-10-09</option> 
     <option Value="Onion">Onion</option> 
     <option Value="Wewe">Wewe</option> 
</select> 


<select name="select2" id="select2"> 
     <option Value="2013-10-10">2013-10-10 Style 1</option> 
     <option Value="2013-10-10">2013-10-10 Style 2</option> 
     <option Value="2013-10-10">2013-10-10 Style 3</option> 
     <option Value="2013-10-09">2013-10-09 Style 1</option> 
     <option Value="2013-10-09">2013-10-09 Style 2</option> 
     <option Value="2013-10-09">2013-10-09 Style 3</option> 
     <option Value="Orange">Orange Style 4</option> 
     <option Value="Onion">Onion Style 1</option> 
     <option Value="Onion">Onion Style 2</option> 
     <option Value="Wewe">wewe Style 2</option> 
</select> 

的JavaScript:

$("#select1").change(function() { 
if($(this).data('options') == undefined){ 
    /*Taking an array of all options-2 and kind of embedding it on the select1*/ 
    $(this).data('options',$('#select2 option').clone()); 
    } 
var id = $(this).val(); 
var options = $(this).data('options').filter('[value=' + id + ']'); 
$('#select2').html(options); 
}); 

演示:http://jsfiddle.net/fRuhn/520/

+0

http://jsfiddle.net/fRuhn/520/ – wewe

+0

下一次只是粘貼代碼到網站告訴你的問題,特別是當它只是幾行時。 – JJJ

回答

1
$("#select1").change(function() { 
    if($(this).data('options') == undefined){ 
     /*Taking an array of all options-2 and kind of embedding it on the select1*/ 
     $(this).data('options',$('#select2 option').clone()); 
    } 
    var id = $(this).val(); 
    var options = $(this).data('options').filter(function() { 
     return (id === '') || id === $(this).val(); 
    }); 
    $('#select2').html(options); 
    $('#select2').val($('#select2 option:first').val()); 
});