0

Buenas estoy intentando hacer una consulta a una base de datos con AJAX una vez que el usuario haya introducido valores en 3 input. La consulta debe meter los resultados en el datalist de un 4º input. El problema lo tengo en el selector, lo he hecho anidándolos de manera que si los rellenas los 3 en orden hace correctamente la consulta AJAX pero si los haces desordenados (Ej: introduces valor para el 2º input y luego para el 1º) no lo realiza correctamente. ¿Cómo evito eso?

$("#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);
                    });
                });
            });
2
  • No entiendo que es lo que quieres hacer ni que es lo que estás intentando, ¿puedes explicar mejor tu problema?
    – Jorius
    Commented el 25 ago. 2017 a las 13:51
  • Simplemente quiero un selector de jquery que al introducir valores en 3 input en cualquier orden de inserción realice una función, el selector que he posteado hace eso mismo que quiero pero cuando introduces valores en el orden #clinica -> #medico -> #fecha (Añado todo el código en el post por si se entiende mejor)
    – Ray
    Commented el 25 ago. 2017 a las 13:54

1 respuesta 1

1

Creo que esto te puede servir

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

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge you have read our privacy policy.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.