マルチセレクトブートストラップドロップダウンオプションセレクタが常に正しい/異なる変数を表示しない

Question

私が今使用しているマルチセレクトブートストラップドロップダウンセレクタは、JSを破壊しています。価格帯

私が現在使用しているJavascriptは、ロングレットドロップダウンを完全に（デフォルトで販売価格を示す販売オプションで）選択すると機能しますので、正しい月額料金が表示されますが、販売ドロップダウンオプションは、その後、私は販売価格に戻ってくる必要があります、それは長い間価格のオプションを可能に固定しています。

$(".select_type").change(function() { 
     if ($(this).find(':selected')[0].className === "propertySalesOption") { 
      $('.rentalSearch').hide(); 
      $('.lettingsSearch').hide(); 
      $('.saleSearch, .SalesRentSearch').fadeIn('fast'); 
      $("#longletval").val("0"); 
     } 
     else if ($(this).find(':selected')[0].className === "longLetsOption") { 
      $('.saleSearch').hide(); 
      $('.lettingsSearch').hide(); 
      $('.rentalSearch, .SalesRentSearch').fadeIn('fast'); 
      $("#longletval").val("1"); 
     } 
     else if ($(this).find(':selected')[0].className === "holidayLettingsOption") { 
      $('.saleSearch').hide(); 
      $('.rentalSearch').hide(); 
      $('.SalesRentSearch').hide(); 
      $('.lettingsSearch').fadeIn('fast'); 
     } 
    }); 



<select class="select_type form-control selectpicker"> 
     <option class="propertySalesOption">Property Sales</option> 
     <option class="longLetsOption">Long Lets</option> 
</select> 


<select name="MinimumPrice" class="form-control selectpicker"> 
      <option value="0">Min Price</option> 
      <option class="rentalSearch" style="display:none;" value="500">&euro;500 (/m)</option> 
      <option class="rentalSearch" style="display:none;" value="600">&euro;600 (/m)</option> 
      <option class="rentalSearch" style="display:none;" value="700">&euro;700 (/m)</option> 
      <option class="rentalSearch" style="display:none;" value="800">&euro;800 (/m)</option> 
      <option class="rentalSearch" style="display:none;" value="900">&euro;900 (/m)</option> 
      <option class="rentalSearch" style="display:none;" value="1000">&euro;1.000 (/m)</option> 
      <option class="rentalSearch" style="display:none;" value="1200">&euro;1.200 (/m)</option> 
      <option class="rentalSearch" style="display:none;" value="1400">&euro;1.400 (/m)</option> 
      <option class="rentalSearch" style="display:none;" value="1600">&euro;1.600 (/m)</option> 
      <option class="rentalSearch" style="display:none;" value="1800">&euro;1.800 (/m)</option> 
      <option class="rentalSearch" style="display:none;" value="2000">&euro;2.000 (/m)</option> 
      <option class="rentalSearch" style="display:none;" value="2500">&euro;2.500 (/m)</option>        
      <option class="rentalSearch" style="display:none;" value="3000">&euro;3.000 (/m)</option> 
      <option class="rentalSearch" style="display:none;" value="4000">&euro;4.000 (/m)</option> 
      <option class="rentalSearch" style="display:none;" value="5000">&euro;5.000 (/m)</option> 
      <option class="rentalSearch" style="display:none;" value="10000">&euro;10.000 (/m)</option> 
      <option class="rentalSearch" style="display:none;" value="15000">&euro;15.000 (/m)</option> 

      <option class="saleSearch" value="50000">&euro;50.000</option> 
      <option class="saleSearch" value="75000">&euro;75.000</option> 
      <option class="saleSearch" value="100000">&euro;100.000</option> 
      <option class="saleSearch" value="125000">&euro;125.000</option> 
      <option class="saleSearch" value="150000">&euro;150.000</option> 
      <option class="saleSearch" value="175000">&euro;175.000</option> 
      <option class="saleSearch" value="200000">&euro;200.000</option> 
      <option class="saleSearch" value="250000">&euro;250.000</option> 
      <option class="saleSearch" value="300000">&euro;300.000</option> 
      <option class="saleSearch" value="350000">&euro;350.000</option> 
      <option class="saleSearch" value="400000">&euro;400.000</option> 
      <option class="saleSearch" value="450000">&euro;450.000</option> 
      <option class="saleSearch" value="500000">&euro;500.000</option> 
      <option class="saleSearch" value="550000">&euro;550.000</option> 
      <option class="saleSearch" value="600000">&euro;600.000</option> 
      <option class="saleSearch" value="650000">&euro;650.000</option> 
      <option class="saleSearch" value="700000">&euro;700.000</option> 
      <option class="saleSearch" value="750000">&euro;750.000</option> 
      <option class="saleSearch" value="800000">&euro;800.000</option> 
      <option class="saleSearch" value="850000">&euro;850.000</option> 
      <option class="saleSearch" value="900000">&euro;900.000</option> 
      <option class="saleSearch" value="950000">&euro;950.000</option> 
      <option class="saleSearch" value="1000000">&euro;1.000.000</option> 
      <option class="saleSearch" value="1500000">&euro;1.500.000</option> 
      <option class="saleSearch" value="2000000">&euro;2.000.000</option> 
      <option class="saleSearch" value="2500000">&euro;2.500.000</option> 
      <option class="saleSearch" value="3000000">&euro;3.000.000</option> 
      <option class="saleSearch" value="3500000">&euro;3.500.000</option> 
      <option class="saleSearch" value="4000000">&euro;4.000.000</option> 
      <option class="saleSearch" value="4500000">&euro;4.500.000</option> 
     </select> 

私はそれが正常に動作下に、これはJS追加すると、しかし、ドロップダウンオプションはコンテナに切断しても、私の二次検索のドロップダウンオプションを台無しに、下のコードやスクリーンショットを参照してください。

<script> 
     $(document).ready(function() { 
      $('.selectpicker').selectpicker(); 
     });    
    </script> 

Answer 1

私はあなたのjavascriptの前に、最新のjQueryのバージョンが含まれているし、それが動作します

<script src="http://code.jquery.com/jquery-latest.min.js" 
    type="text/javascript"></script> 

<script> 

$(".select_type").change(function() { 
    if ($(this).find(':selected')[0].className === "propertySalesOption") { 
     $('.rentalSearch').hide(); 
     $('.lettingsSearch').hide(); 
     $('.saleSearch, .SalesRentSearch').fadeIn('fast'); 
     $("#longletval").val("0"); 
    } 
    else if ($(this).find(':selected')[0].className === "longLetsOption") { 
     $('.saleSearch').hide(); 
     $('.lettingsSearch').hide(); 
     $('.rentalSearch, .SalesRentSearch').fadeIn('fast'); 
     $("#longletval").val("1"); 
    } 
    else if ($(this).find(':selected')[0].className === "holidayLettingsOption") { 
     $('.saleSearch').hide(); 
     $('.rentalSearch').hide(); 
     $('.SalesRentSearch').hide(); 
     $('.lettingsSearch').fadeIn('fast'); 
    } 
}); 

また、javascriptコードにスクリプトタグを追加します。

ここで確認してください：http://cssdeck.com/labs/ww8wpwn7