mardi 23 mars 2021

How to make an if..else statement that will return true if your checkbox is being clicked?

I recently having a problem with this if else statement

So both have a specific id name which is "premium" and "regular"

I wanted to make an if else statement using jquery that will return able my input's

Here is what my checkbox need to do,

  • if my checkbox is being checked I wanted the input to be enabled
  • else nothing happen because it is already disabled.
$("#PreCap").prop('disabled', true);
$("#PreA").prop('disabled', true);

$("#RegCap").prop('disabled', true);
$("#RegA").prop('disabled', true);


//var premium = document.querySelector("#premium").checked;
// var regular = document.getElementById("regular");

$('#premium').val();

if ($("#premium").is(":checked")) {
  $("#PreCap").prop('disabled', false);
  $("#PreA").prop('disabled', false);
} else if (regular.checked === true) {
  document.getElementById("RegCap").disabled = false;
  document.getElementById("RegA").disabled = false;
}
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<input type="checkbox" class="form-check-input" id="premium">
<label class="form-check-label" type="checkbox" for="premium">Premium Air Conditioner</label>
<input type="number" id="PreCap" class="form-control" placeholder="Seat Capacity">

<input type="checkbox" class="form-check-input" id="regular">
<label class="form-check-label" type="checkbox" for="regular">Regular Air conditioner</label>
<input type="number" id="RegCap" class="form-control" placeholder="Seat Capacity">

Note: I am using bootstrap 5 and jquery-3.5.1.min.js




Aucun commentaire:

Enregistrer un commentaire