Enable Select Field with Javascript

Question

Enable Select Field with Javascript

Navigation

#1 by (1 votes)
#2 by (0 votes)

1

Expensive,

I have an input text that will receive a date, and after completing this field, I need the combo selects to be activated. By default, they are disabled.

if (document.getElementById("payment").value.length > 0){
    document.getElementById('campo1').disabled = false;
    document.getElementById('campo2').disabled = false;
    document.getElementById('campo3').disabled = false;
    document.getElementById('campo4').disabled = false;
} else {
    document.getElementById('campo1').disabled = true;
    document.getElementById('campo2').disabled = true;
    document.getElementById('campo3').disabled = true;
    document.getElementById('campo4').disabled = true;
}

The page loads with inputs disabled, but when I set a date in the input (payment), combos selects remain disabled. What am I doing wrong?

Thank you.

javascript

asked by anonymous 13.10.2016 / 23:37

2 answers

0

$(document).ready( function() {


  $("#payment").change( function() {
    
      var value = $("#payment").val();
    
          if (value == "") {
      $(".campo").removeAttr("disabled");
      }
    else {
      $(".campo").attr("disabled", "true");
      }
    
    });
  
  
  });

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script><linkrel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
  <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script><inputid="payment" type="text">

    <div class="checkbox">
      <label><input class="campo" type="checkbox" value="">1</label>
    </div>
    <div class="checkbox">
      <label><input class="campo" type="checkbox" value="">2</label>
    </div>
    <div class="checkbox">
      <label><input class="campo" type="checkbox" value="">3</label>
    </div>
    <div class="checkbox">
      <label><input class="campo" type="checkbox" value="">4</label>
    </div>

I made this code for you, I do not know if that's what you want, but there you go! Just give the run and test!

14.10.2016 / 00:05

Is it possible to create a chord diagram using the d3 library? [duplicate] Progress bar in javascript [closed]

score 1 · Accepted Answer

So it will look something like this here

$( document ).ready(function() {
    $("#payment").keyup(function(){
       if($(this).val()) {
          $("#campo1").prop('disabled', true);
          $("#campo2").prop('disabled', true);
          $("#campo3").prop('disabled', true);
          $("#campo4").prop('disabled', true);
       } else {
          $("#campo1").prop('disabled', false);
          $("#campo2").prop('disabled', false);
          $("#campo3").prop('disabled', false);
          $("#campo4").prop('disabled', false);
       }
    });
});

This should be enough, if something was missing, let me know.

Follow fiddle link link