2011-07-01 7 views
0

2つの選択ボックスがあります.1つは国名を含み、もう1つはすべての国のすべての州名を含んでいます。私は親の選択ボックスからCOUNTRY1を選択した場合Jqueryを使用している親からの子セレクトボックス値のフィルタ

<select id="parent"> 
<option value="Country1">Country1</option> 
<option value="Country2">Country2</option> 
<option value="Country3">Country3</option> 
</select> 

<select id="child"> 
<option value="Country1 state1">Country1 state1</option> 
<option value="Country1 state2">Country1 state2</option> 
<option value="Country2 state1">Country2 state1</option> 
<option value="Country2 state2">Country2 state2</option> 
<option value="Country3 state1">Country3 state1</option> 
</select> 

その後、状態選択ボックスだけではCOUNTRY1のすべての状態を表示し、そこから他のすべての状態を削除する必要がありました。

私はこれで私を助けてください

$(document).ready(function(){ 
$('#parent').change(function(){ 
    var filter = $(this).val(); 
    $('option').each(function(){ 
    if ($('option:contains("' + var1 '")') == filter) {  
    $(this).show(); 
    } else { 
    $(this).hide(); 
    } 
    var var1= $('#child').val(filter); 
    }) 
}) 
}) 

..部分一致による子の値を検索し、親の値で確認する必要があります。

+0

Chained Selects jQueryプラグインのソースを確認します。クラス名を使用すると非常によく似たことをします。あなたはそこから適応できるはずです。 http://www.appelsiini.net/projects/chained –

答えて

0
$("#parent").change(function(){ 
    var filter = $(this).val(); 
    $("#a").append('a'); 
    $('select#child option').each(function(){ 
     $("#a").append('a'); 
     if ($(this).val().substring(0,8) == filter) {  
      $(this).show(); 
     } 
     else { 
      $(this).hide(); 
     } 
    }); 

    var var1= $('#child').val(filter); 
}) 

http://jsfiddle.net/yZm7A/3/

1を見ているように、第2のドロップダウンで選択した値が

+0

'$(this).val()'は決して '== filter'ではなく' filter'で始まることに気をつけてください。だから、 '$(this).val()。substring(0、8)== filter'をチェックするべきです – ub1k

+0

IEブラウザでは機能しませんか? – user811589

0

IE

else { 
    $(this).hide(); 
} 

else { 
    $(this).remove(); 
} 
への変更をお試しを変えないという問題が残されているものの、
関連する問題