-2

In my first drop down list I have 

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

And my second drop down list I have

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

When I select Paid in first drop down it enable the 2nd drop down list Otherwise disabled please give me some solution how I can do

Khan Muntazar
  • 55
  • 8
  • Can you post some code that you have tried? – Second2None Jan 25 '19 at 09:22
  • 5
    Possible duplicate of [jquery on certain option select on first select list, enable second select list](https://stackoverflow.com/questions/17259027/jquery-on-certain-option-select-on-first-select-list-enable-second-select-list) – adiga Jan 25 '19 at 09:23
  • Stackoverflow isn't a "Please code this for me" Service. You have to show us what you have tried so we can show you why it doesn't work. – Nicolo Lüscher Jan 25 '19 at 09:28
  • @Bolphgolph I am new in this field you have to give some solution like other respected member do other wise skip this type of questions. – Khan Muntazar Jan 25 '19 at 09:31
  • @KhanMuntazar first of all, I don't have to do anything. I recommend you read this article: https://stackoverflow.com/help/on-topic – Nicolo Lüscher Jan 25 '19 at 10:17

2 Answers2

0

You can add/remove disabled property to the second drop down based on the selected value of the first drop down:

$('#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>
Mamun
  • 66,969
  • 9
  • 47
  • 59
0
$('#lr_pay_mode').change(function(){
     if ($(this).val() == '1') {
      $("#mode_of_payment").prop("disabled", true);
   } else {
      $("#mode_of_payment").prop("disabled", false);  
   }
});

and by default disabled second dropdown

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

I hope it will help

Jigneshsinh Rathod
  • 990
  • 7
  • 9