別の選択ドロップダウンからの選択に従って、選択ドロップダウンからオプションを削除するにはどうすればいいですか？

Question

JavaScriptを使用しています。ドロップダウンを選択してください。私は自分のコード内で選択した種類の支払いタイプを変更したいと思います。 コードは

$(document).ready(function() { 
 
    $("#reservationType").change(function() {   
 
     managePaymentTypes(); 
 
    });  
 
}); 
 

 
var $reservationTypeObj = $('#reservationType').selectize({ 
 
    sortField: { 
 
     field: localStorage.getItem("selectizeField"), 
 
     direction: localStorage.getItem("selectizeDirection") 
 
    }, 
 
     dropdownParent: localStorage.getItem("selectizeDropdownParent") 
 
}); 
 

 
var $paymentTypeObj = $('#paymentType').selectize({ 
 
    sortField: { 
 
     field: localStorage.getItem("selectizeField"), 
 
     direction: localStorage.getItem("selectizeDirection") 
 
    }, 
 
     dropdownParent: localStorage.getItem("selectizeDropdownParent") 
 
}); 
 

 
function managePaymentTypes(){ 
 
    var resType = $('#reservationType :selected').val(); 
 
     if(resType==202){ 
 
     //remove option 2 - Salary deduct in selectize. 
 
     }else if(resType==101) { 
 
     //remove option 1 - Credit in selectize. 
 
     }else{ 
 
     //// 
 
     } 
 
}

<label class="col-md-1 control-label firstcol" for="type" style="text-align:left">Reservation Type : </label> 
 
<div class="col-md-2" id="reservationTypeDiv" data-toggle="tooltip" data-container="body" data-placement="bottom"> 
 
\t <select class="demo-default selectized" id="reservationType" name="reservationType" tabindex="7" opacity: 1" data-toggle="tooltip" data-container="body" data-placement="bottom"> 
 
\t \t <% 
 
\t \t for (int l = 0; l < reservationTypes.size(); l++) 
 
\t \t { 
 
\t \t %> 
 
\t \t \t <option value="<%=reservationTypes.get(l).getId()%>"><%=reservationTypes.get(l).getDescription()%></option> 
 
\t \t <% 
 
\t \t } 
 
\t \t %> 
 
\t </select>  
 
</div> 
 
<label class="col-md-1 control-label firstcol" for="payment" style="text-align:left">Payment Type : </label> 
 
<div class="col-md-2" data-toggle="tooltip" id="paymentTypeDiv" data-container="body" data-placement="bottom"> 
 
\t <select class="demo-default selectized" id="paymentType"  name="paymentType" tabindex="7" opacity: 1" data-  toggle="tooltip" data-container="body" data-placement="bottom"> 
 
\t \t <% 
 
\t \t for (int l = 0; l < reservationPaymentTypes.size(); l++) 
 
\t \t { 
 
\t \t %> 
 
\t \t \t <option value="<%=reservationPaymentTypes.get(l).getId()%>"><%=reservationPaymentTypes.get(l).getDescription()%></option> 
 
\t \t <% 
 
\t \t } 
 
\t \t %> 
 
\t </select>  
 
</div>

は、私は2つのselectizeのドロップダウンを持っている、以下の通りです。予約タイプ

については

1. payementタイプの場合

値は、データベースから取得しています。 Reservation types drop-down screenshotPayment types drop-down screenshot

予約タイプが変更された場合、支払いタイプを変更したいと思います。 したがって予約タイプのonchange私はmanagePaymentTypes（）という名前のメソッドを呼び出しました。予約タイプが個人（101）の場合、クレジット決済オプションを削除します。予約タイプがCoporate（202）の場合、Salary deductオプションを削除したいと思います。個人はデフォルト選択でなければなりません。これは私の必要条件です。誰かがこれを解決するために私を助けてください。

Answer 1

私は以下の解決策を考え出しました。

$(document).ready(function() {  
<% 
    for(SportsCenterReservationPaymentType paymentType : reservationPaymentTypes){ 
    %> 
     paymentTypes.push({id: <%=paymentType.getId()%>, desc: '<%=paymentType.getDescription()%>'}); 
    <% 
    } 
    %> 
    $("#reservationType").change(function() {   
     loadResourceTable(); 
     managePaymentTypes(); 
    });  

}）;

function managePaymentTypes(){ 
    var resType = $('#reservationType :selected').val(); 
    $('#paymentType')[0].selectize.clearOptions(); 

    if(resType==202&& resType!=101){ 

     $.each(paymentTypes, function (idx, obj) { 
      if(obj.id!=333){ 
       $('#paymentType')[0].selectize.addOption({value:obj.id,text:obj.desc}) 
      } 
     }); 
    } 

    if(resType==101&&resType!=202){ 

     $.each(paymentTypes, function (idx, obj) { 
      if(obj.id!=222){ 
       $('#paymentType')[0].selectize.addOption({value:obj.id,text:obj.desc}) 
      } 
     }); 
    } 

}