Jquery Selector

0

Good I am trying to make a query to a database with AJAX once the user has entered values in 3 input. The query must enter the results in the datalist of a 4th input. The problem I have in the selector, I have done it by nesting them so that if you fill them in 3 order correctly AJAX query but if you do disordered (eg: you enter value for the 2nd input and then for the 1st) does not perform correctly. How do I avoid that?

$("#clinica").on("input", function () {
            $("#medico").on("input", function () {
                $("#fecha").on("input", function () {
                   $.get("cambio_fecha.php", { clinicaHora: $('#clinica').val(),
                         medicoHora: $('#medico').val(),
                         fechaHora: $('#fecha').val()}, function (data) {
                               $("#opcionesHoras").empty();
                               $("#opcionesHoras").append(data);
                    });
                });
            });
    
asked by Ray 25.08.2017 в 15:29
source

1 answer

1

I think this can help you

$(document).ready(function(){
  
  $(document).on('input', '#clinica, #medico, #fecha', function(){
    
     const cli = $('#clinica').val();
     const med = $('#medico').val();
     const fec = $('#fecha').val();
     
     if(cli != '' && med != '' && fec != ''){
      $('.result').html(cli + '<br />' + med + '<br />' + fec);
      // Hacer AJAX o lo que sea que necesitas
     }
    
  })
  
})
.result{
  font-family: Arial;
  padding: 5px;
  width: 161px;
  height: 50px;
  border: 1px solid black;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="text" id="clinica" placeholder="Clinica" /><br />
<input type="text" id="medico" placeholder="Médico" /><br />
<input type="text" id="fecha" placeholder="Fecha" /><br />
<div class="result"></div>
    
answered by 25.08.2017 / 16:02
source