[英]How to remove options from a selectize dropdown according to a selection from another selectize dropdown?
我正在使用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"> <select class="demo-default selectized" id="reservationType" name="reservationType" tabindex="7" opacity: 1" data-toggle="tooltip" data-container="body" data-placement="bottom"> <% for (int l = 0; l < reservationTypes.size(); l++) { %> <option value="<%=reservationTypes.get(l).getId()%>"><%=reservationTypes.get(l).getDescription()%></option> <% } %> </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"> <select class="demo-default selectized" id="paymentType" name="paymentType" tabindex="7" opacity: 1" data- toggle="tooltip" data-container="body" data-placement="bottom"> <% for (int l = 0; l < reservationPaymentTypes.size(); l++) { %> <option value="<%=reservationPaymentTypes.get(l).getId()%>"><%=reservationPaymentTypes.get(l).getDescription()%></option> <% } %> </select> </div>
我有两个选择下拉列表。
价值是从数据库中获取的。 预订类型下拉屏幕截图 , 付款类型下拉屏幕截图
当预订类型更改时,我想更改付款类型。 因此,在更改保留类型时,我调用了一个名为managePaymentTypes()的方法。 当预订类型为“个人(101)”时,我想删除“信用卡付款”选项。 当预订类型为Coporate(202)时,我想删除薪金扣除选项。 单个应为默认选择。 这是我的要求。 有人请帮我解决这个问题。
我想出了以下解决方案。
$(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})
}
});
}
}
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.