Formulario JavaScript

Si prefieres enviar los datos sin recargar la página, puedes usar JavaScript con fetch para hacer el envío de forma asíncrona. Esto te da control total sobre la experiencia del usuario después del envío.

Envío con fetch

<form id="mi-formulario">
  <input type="text" name="nombre" placeholder="Tu nombre">
  <input type="email" name="email" placeholder="Tu correo">
  <textarea name="mensaje" placeholder="Tu mensaje"></textarea>
  <button type="submit">Enviar</button>
</form>

<script>
  const form = document.getElementById('mi-formulario');

  form.addEventListener('submit', async function (e) {
    e.preventDefault();

    const formData = new FormData(form);

    const response = await fetch('https://simpleapiform.com/f/{form_id}', {
      method: 'POST',
      body: formData,
    });

    if (response.ok) {
      console.log('Envío exitoso');
      // Muestra un mensaje de éxito o redirige al usuario
    } else {
      console.error('Error al enviar el formulario');
    }
  });
</script>

Envío con JSON

const response = await fetch('https://simpleapiform.com/f/{form_id}', {
  method: 'POST',
  headers: {
    'Content-Type': 'application/json',
  },
  body: JSON.stringify({
    nombre: 'Ana García',
    email: '[email protected]',
    mensaje: 'Hola, me gustaría más información.',
  }),
});

Respuesta del servidor

El servicio devuelve una respuesta JSON con el resultado del envío:

{
  "success": true,
  "message": "Form submitted successfully"
}

Puedes usar esta respuesta para mostrar un mensaje de confirmación, limpiar el formulario o redirigir al usuario desde tu propio código.

Tip: Cuando usas JavaScript para el envío, la configuración de redirección del dashboard no aplica. La redirección o el mensaje de confirmación quedan bajo tu control en el frontend.