es.davy.ai

Preguntas y respuestas de programación confiables

¿Tienes una pregunta?

Si tienes alguna pregunta, puedes hacerla a continuación o ingresar lo que estás buscando.

Validación de formulario de Google con consulta de URL

13 Jul, 2023 Programación

Disculpa por mi falta de precisión en la terminología, pero no estoy muy familiarizado con HTML/js/app script.

Trabajamos con muchos clientes cada mes y organizamos eventos con ellos. Cada uno de nuestros clientes tiene un código único que es necesario para participar en nuestros eventos.

Dependemos mucho de Google Forms para permitir a los clientes reservar sus lugares. En el formulario, les pedimos su código, pero no tenemos ningún tipo de validación.

Recientemente se nos ha dado acceso a una API de base de datos que funciona con consultas de URL (por ejemplo, www.mydatabase.com/q=CODIGO). Si el “CODIGO” es válido, se devuelve un valor JSON no vacío.

Estaba buscando una forma de utilizar la función de validación de formularios de Google (https://support.google.com/docs/answer/3378864?hl=es) con la consulta de URL. Me gustaría tener una sección inicial en nuestros formularios donde nuestros clientes necesiten ingresar su código. Si es válido, el resto del formulario se les muestra, si no, no pueden continuar.

Miré aquí y en el soporte de Google, pero no pude encontrar una forma de validar usando una consulta. ¿Me perdí algo?

Si no hay forma de hacerlo así, ¿cuál sería el camino más accesible y directo?

Estamos utilizando Google Forms porque es conveniente y yo soy el único programador en mi grupo, así que me gustaría hacer las cosas lo más fáciles posible para mis colegas sin que tengan que programar nada. Lo ideal sería tener un complemento de un solo botón en Google Form que genere automáticamente la sección (o página HTML).

EDICIÓN: Pregunta más específica

Tags:  , , ,

Answer

  1. Avatar for davy.ai
    davy.ai

    Como experto en TI con experiencia en JavaScript, HTML, Google Apps Script y Google Forms, aquí está mi respuesta a tu pregunta:

    No es posible validar formularios de Google usando una consulta de URL directamente. Sin embargo, puedes lograr el resultado deseado creando una aplicación web personalizada utilizando Google Apps Script que reciba la entrada del formulario, consulte la API de la base de datos para validar el código y decida si mostrar u ocultar el resto del formulario basado en la respuesta de la API.

    Así es cómo puedes crear una aplicación web utilizando Google Apps Script:

    1. Abre una nueva hoja de cálculo de Google y haz clic en “Herramientas” > “Editor de secuencias de comandos”. Esto abrirá la ventana del editor de Google Apps Script.

    2. En la ventana del editor, crea un nuevo archivo de secuencia de comandos haciendo clic en “Archivo” > “Nuevo” > “Archivo de secuencia de comandos”.

    3. Dale un nombre al archivo de secuencia de comandos como “MiAplicacionWeb” y escribe el siguiente código:

    function doGet() {
  var template = HtmlService.createTemplateFromFile('Pagina');
  template.action = ScriptApp.getService().getUrl();
  return template.evaluate();
}

function processForm(form) {
  var code = form.code;
  var response = UrlFetchApp.fetch('https://www.midatabase.com/q=' + code); // reemplaza con tu endpoint de API
  var data = JSON.parse(response.getContentText());
  if (data.valid) {
    // muestra el resto del formulario
    return HtmlService.createHtmlOutput('Código válido. Aquí va el resto del formulario.');
  } else {
    // muestra un mensaje de error y actualiza la página
    return HtmlService.createHtmlOutput('Código inválido. Por favor, intenta nuevamente.').setMetaTag('refresh', '5');
  }
}
    1. Crea un nuevo archivo HTML en el mismo directorio que el archivo de secuencia de comandos, nómbralo “Pagina.html”, y escribe el siguiente código:
    <!DOCTYPE html>
<html>
  <head>
    <base target="_top">
  </head>
  <body>
    <form id="miFormulario" onsubmit="submitForm(event)">
      <input type="text" name="code" placeholder="Ingresa tu código">
      <button type="submit">Enviar</button>
    </form>
    <script>
      function submitForm(event) {
        event.preventDefault();
        var form = document.getElementById('miFormulario');
        google.script.run.withSuccessHandler(function(result) {
          document.body.innerHTML = result;
        }).processForm(form);
      }
    </script>
  </body>
</html>

    1. Guarda ambos archivos y vuelve a la hoja de cálculo de Google. Ejecuta la función “doGet” haciendo clic en “Ejecutar” > “doGet”. Esto abrirá una nueva pestaña en tu navegador con la URL de la aplicación web.

    2. Abre la URL de la aplicación web en una nueva pestaña y deberías ver un formulario solicitando el código. Ingresa un código y haz clic en “Enviar”. Si el código es válido según la API, se mostrará el resto del formulario. Si el código es inválido, se mostrará un mensaje de error y la página se actualizará después de 5 segundos.

    3. Puedes insertar esta aplicación web en un formulario de Google haciendo clic en “Configuración” (ícono de engranaje) > “Presentación” > “Insertar HTML”. Ingresa la URL de la aplicación web y haz clic en “Guardar”. Cuando los usuarios abran el formulario, verán la sección inicial con la entrada del código y, si el código es válido, se mostrará el resto del formulario.

    ¡Espero que esto te ayude!

Comments are closed.