値が選択されている場合に別の選択値を表示する方法

Question

私のウェブサイトには簡単なフォームがあります。のような：Select 1とSelect 2。私はそれが欲しい場合私はSelect 1値Home、Select 2の値は例えばに変更します。 residance。

どのようにデータベースでそれを行うことができますか？ Otel（2 stars、3stars、4stars）

を選択した場合

Select 1値= Home、Otels

Select 2値= Home（residance、room、apart）を選択した場合、 ：私は、データベースからこれらの値を取得しています

<div class="row pick-size"> 
    <div class="col-lg-4 col-md-8 col-sm-6"> 
     <select class="selectpicker" data-size="3" data-style="select-with-transition btn btn-simple"> 
      <option value="0">Select</option> 
      <option value="1">Home</option> 
      <option value="2">Otels</option> 
     </select> 
    </div> 
    <div class="col-lg-4 col-md-8 col-sm-6"> 
     <select class="selectpicker" data-size="3" data-style="select-with-transition btn btn-simple"> 
      <!--if selected Home show this values--> 
      <option value="1">residance</option> 
      <option value="2">room</option> 
      <option value="3">apart</option> 
      <!--if selected Otels show this values--> 
      <option value="0">2 stars</option> 
      <option value="1">3 stars</option> 
      <option value="2">4 stars</option> 
     </select> 
    </div> 
</div> 

Answer 1

innerHTML JavaScriptプロパティを使用して差分を追加するだけでドロップダウン。

最初の値が選択されるまで、2番目のドロップダウンを非表示にすることをおすすめします。これにより、ユーザーエクスペリエンスが向上します。

しかし、もっと洗練された解決策がいくつかあります。here