1

Tengo una función que llamo al hacer click en un botón, la idea es que esconda una div mientras ejecuta un script PHP por ajax async: false, pero por alguna razón no me ejecuta la linea del hide, el resto todo ok., pero la primera linea no la corre, este es el código:

function reSendQRs(ven_id, ven_mailUsuario) {
    $(".modal-resultados").hide(); // esta línea no se ejecuta!!

    ven_mailUsuario = prompt("El mail de notificación se reenviará al siguiente correo:", ven_mailUsuario);
    if (ven_mailUsuario) {
        if (validaEmail(ven_mailUsuario))
            reSendQRsAjax(ven_id, ven_mailUsuario);
        else 
            alert("El correo <b>" + ven_mailUsuario + "</b> no es válido!");
    }
    $(".modal-resultados").show();
}

Saludos y Gracias!

2
  • incluir el html Commented el 22 dic. 2023 a las 1:16
  • para cancelar cualquier animacion pendiente $(".modal-resultados").stop().hide(); para darle tiempo a (no)verse $(".modal-resultados").delay(200).show(); Commented el 31 dic. 2023 a las 2:59

1 respuesta 1

1

Tu tienes la siguiente situación:

function UnaFuncion() {
    console.log("Instrucción 1");
    let p = prompt("mensaje");
    console.log("Instrucción 2");
}
UnaFuncion();

Como puedes ver en el ejemplo anterior, los mensajes por consola no se muestran hasta que el prompt se esconde, aun cuando existe un console.log("Instrucción 1"); antes de ese prompt

Esto sucede porque si bien javascript se ejecuta secuencialmente, la actualización a dichos cambios no sucede por cada una de las instrucciones, si no que hay un control interno para renderizar. Entonces, tu primera instrucción $(".modal-resultados").hide(); está pendiente cuando entra el prompt y le gana a todo y salta en pantalla

La solución es crear un pequeño delay para dar tiempo a renderizar, algo como:

async function UnaFuncion() {
    console.log("Instrucción 1");
    const p = await ShowPromt("Mensaje");
    console.log("Instrucción 2");
}
async function ShowPromt(titulo , texto = ""){
  return new Promise(r => setTimeout(()=>r(prompt(titulo,texto)), 100));
}
UnaFuncion();

Si no te acomoda que tu función reSendQRs (equivalente a "UnaFuncion" en el ejemplo) sea del tipo async puede ser entonces:

function UnaFuncion() {
    console.log("Instrucción 1");
    ShowPromt("Mensaje").then(resp => {
      console.log("Instrucción 2", resp);
      /*
      if (resp) {
        if (validaEmail(resp))
            reSendQRsAjax(ven_id, ven_mailUsuario);
        else 
            alert("El correo <b>" + resp + "</b> no es válido!");
        }
       $(".modal-resultados").show();
       */
    });
    
}
async function ShowPromt(titulo , texto = ""){
  return new Promise(r => setTimeout(()=>r(prompt(titulo,texto)), 100));
}
UnaFuncion();

5
  • Hola amigo, gracias por tu ayuda, pero hice lo que tienes, de hecho al ejecutar el primer código, si se ejecuta el log 1 antes del prompt... y por otro lado, el segundo código hace exactamente lo mismo... no me ha solucionado este código el problema... Gracias de todas maneras!
    – Mago Rola
    Commented el 26 dic. 2023 a las 15:10
  • @MagoRola No es así, simplemente presiona el botón "ejecutar" del segundo código y vas a ver que imprime Instrucción 1, luego ejecuta el prompt y solo al cerrar el prompt ejecuta Instrucción 2
    – Yussef
    Commented el 26 dic. 2023 a las 20:12
  • Si, pero si ejecuas el primero pasa lo mismo... a eso me refiero
    – Mago Rola
    Commented el 28 dic. 2023 a las 16:48
  • @MagoRola Pero evidentemente, si el primer código es una reducción de lo que TU tienes, es para mostrar el mismo error pero reemplazando el .hide() por un mensaje en consola y quitando esas validaciones que solo aportan ruido al problema. Y desde ahí generar una solución. En el sitio a esto se le llama ejemplo mínimo verificable y es lo que tu deberías haber colocado en tu pregunta desde el inicio
    – Yussef
    Commented el 28 dic. 2023 a las 21:39
  • @MagoRola Recuerda que si la respuesta es correcta puedes marcarla como aceptada. Saludos
    – Yussef
    Commented el 28 dic. 2023 a las 21:39

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.