如何根據從其他選擇下拉列表中選擇的選項從選擇下拉菜單中刪除選項？

Question

我正在使用JavaScript Selectize下拉菜單。我想根據代碼中選擇的類別更改付款類型。 代碼是如下，

$(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>

我有兩個selectize下拉菜單。

1. 對於預約類型
2. 對於payement型

值是從數據庫中獲取。 Reservation types drop-down screenshot,Payment types drop-down screenshot

當預訂類型發生變化時我想更改付款類型。 因此onchange的預訂類型我已經調用了一個名爲managePaymentTypes（）的方法。當預訂類型爲個人（101）時，我想要移除信用付款選項。當預訂類型爲Coporate（202）時，我想刪除薪酬扣除選項。個人應該是默認選擇。這是我的要求。有人請幫我解決這個問題。

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}) 
      } 
     }); 
    } 

}