Es mi primera publicación aquí y, por favor, perdónenme por mi inglés. Aquí está el problema que encontré: estoy tratando de validar la dirección del usuario al enviar un formulario usando una API externa. Mi objetivo es evitar que el formulario se envíe en función de una variable definida de forma asíncrona (que es el error). Me gustaría devolver de alguna manera una variable de una función asíncrona (la variable se redefine después de una solicitud basada en promesas a la API). Aquí está el código:
function validateAdress(requestString) { callToTheAPIMethod(request).then((res) => { let error; const obj = res.getDataFromApi ...obj data from async call const precision = ...parameters from an API on which i rely in order to set up the error message if (obj) { switch (precision) { case "exact": error = ""; break; case "number": case "near": case "range": error = "Adress is incorrect. Please specify house number"; break; case "street": error = "Adress is incorrect. Please specify house number"; break; case "other": default: error = "dress is incorrect. Please specify smth..."; } } $(".address_error").text(error); return error; }); } function validateForm() { validateAdress(requestString) if (validateAdress(requestString) return false ///i get it that i am not able to return the variable directly from this call, only a promise to resolve /// if error is not empty prevent form from submitting ...some other code validating input fields }Como resultado, a la variable de error se le asigna una cadena de texto que especifica el tipo de error y se agrega al DOM. La función validateAdress se llama en alguna otra función que se usa para validar un formulario en el lado del cliente. El problema es que estoy tratando de evitar que se envíe el formulario si se ha asignado un valor a la variable error . Me parece que no es posible hacerlo. Si estoy tratando de devolver esa variable desde las funciones de validateAdress , obviamente está devolviendo indefinido ... Desafortunadamente, tampoco puedo usar la sintaxis async / await aquí ... Apreciaría mucho si alguien me puede dar una pista sobre cómo implementar eso tipo de funcionalidad o cómo acceder a la variable de error.
Puede llamar a preventDefault en el controlador de envío de formularios, llamar a la función asíncrona, si todo está bien, llamar al método de submit de formularios.
p.ej..
const form = document.querySelector('form'); const input = document.querySelector('input'); function check(done) { setTimeout(() => { done(input.value === '1'); }, 1000); } form.addEventListener('submit', e => { e.preventDefault(); check(ok => { if (ok) form.submit(); else console.log('try again.'); }); }); Type 1 into input and press enter, and wait 1 second.. <form> <input /> </form>