Question

在我的第一个下拉列表中，

 <div class="form-group row">
   <label class="col-md-4">L.R. Pay Mode</label>
   <select name="lr_pay_mode" id="lr_pay_mode">
        <option value="">Select</option>
        <option value="1">Paid</option>
        <option value="2">To Pay</option>
      </select>
  </div>

还有第二个下拉列表

<div class="form-group row">
 <label class="col-md-4">Mode Of Payment</label>
 <select  name="mode_of_payment" id="mode_of_payment">
    <option value="">Select</option>
    <option value="1">Cash</option>
    <option value="2">Cheque</option>
     </select>
    </div>

当我在第一个下拉列表中选择Paid时，启用第二个下拉列表，否则禁用请给我一些解决方法

Answer 1

您可以根据第一个下拉列表的选定值向第二个下拉列表添加/删除禁用属性：

$('#lr_pay_mode').change(function(){
  if((this).value != '1')
    $('#mode_of_payment').attr('disabled','disabled')
  else
    $('#mode_of_payment').removeAttr('disabled')
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="form-group row">
 <label class="col-md-4">L.R. Pay Mode</label>
 <select name="lr_pay_mode" id="lr_pay_mode">
      <option value="">Select</option>
      <option value="1">Paid</option>
      <option value="2">To Pay</option>
    </select>
</div>


<div class="form-group row">
 <label class="col-md-4">Mode Of Payment</label>
 <select  name="mode_of_payment" id="mode_of_payment" disabled>
    <option value="">Select</option>
    <option value="1">Cash</option>
    <option value="2">Cheque</option>
 </select>
</div>

Answer 2

$('#lr_pay_mode').change(function(){
     if ($(this).val() == '1') {
      $("#mode_of_payment").prop("disabled", true);
   } else {
      $("#mode_of_payment").prop("disabled", false);  
   }
});

，默认情况下禁用第二个下拉列表

<div class="form-group row">
 <label class="col-md-4">Mode Of Payment</label>
 <select  name="mode_of_payment" id="mode_of_payment" disabled>
    <option value="">Select</option>
    <option value="1">Cash</option>
    <option value="2">Cheque</option>
 </select>
</div>

我希望它将对您有帮助

当我从第一个下拉列表中选择值形式时，我有两个下拉列表

2 个答案: