Wie entferne ich Optionen aus einer Auswahlliste, die einer Auswahl aus einer anderen Auswahlliste entspricht?

Question

Ich benutze JavaScript Selectize Dropdown. Ich möchte die Zahlungsarten gemäß der Auswahl des Reserverationstyps in meinem Code ändern. -Code ist, wie folgend,

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

Ich habe zwei selectize Aufklappmenü.

1. Für Reservierungsart
2. Für payement Typ

Die Werte werden aus der Datenbank zu bekommen. Reservation types drop-down screenshot

Wenn Reservierungstyp ändert Ich möchte die Zahlungsarten ändern. Deshalb habe ich bei Änderung des Reservierungstyps eine Methode namens managePaymentTypes() aufgerufen. Ich möchte die Kredit-Zahlungsoption entfernen, wenn die Reservierungsart Individual (101) ist. Und ich möchte Gehaltsabzugsoption entfernen, wenn Reservierungsart Coporate ist (202). Individuell sollte die Standardauswahl sein. Das ist meine Anforderung. Jemand bitte hilf mir das zu lösen.

Answer 1

Ich habe die folgende Lösung gefunden.

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

}