Skip to main content

Enviar formularis amb FormSubmit

En aquest capítol aprendrem a fer servir FormSubmit, una eina gratuïta que ens permet enviar formularis HTML sense necessitat de backend.

Què és FormSubmit?​

És un servei que permet rebre les dades d’un formulari HTML al teu correu electrònic, sense configurar cap servidor ni programar backend.

Exemple bàsic de formulari amb FormSubmit​

<form action="https://formsubmit.co/teu@email.com" method="POST">
  <input type="text" name="nom" placeholder="Nom" required />
  <input type="text" name="cognom" placeholder="Cognom" required />
  <input type="email" name="email" placeholder="Email" required />

  <select name="genere" required>
    <option value="">Selecciona el teu gènere</option>
    <option value="home">Home</option>
    <option value="dona">Dona</option>
    <option value="altres">Altres</option>
  </select>

  <button type="submit">Enviar</button>
</form>

Pasos per rebre l'email​

  1. Prepara el formulari i posa el teu email real a action.
  2. Envia el formulari una primera vegada.
  3. Rebràs un correu de verificació per activar la recepció.
  4. Un cop activat, pots canviar el correu per una string random que et proporciona FormSubmit, per protegir la privadesa.

Redirecció després de l'enviament​

Per redirigir l’usuari després de completar el formulari:

<input type="hidden" name="_next" value="https://elmeulloc.com/gracies.html" />

Això evita que l’usuari vegi la pàgina per defecte de FormSubmit.

Com desactivar un formulari​

  • Ves a: formsubmit.co/help
  • Introdueix l'email que has utilitzat per registrar-te
  • I podràs desactivar la recepció de formularis

Activitat 1​

Crea un formulari amb els següents camps:

  • Nom
  • Cognom
  • Email
  • Gènere (amb <select>)

Configura’l per enviar-se amb FormSubmit i redirigir a una pàgina de gràcies.

Activitat 2​

Crea un formulari de reserva de taula en un restaurant:

  • Nom
  • Data (només propers 30 dies)
  • Hora (entre 13:00 i 22:00)
  • Número de persones

FormSubmit és una eina ràpida i senzilla per enviar formularis sense complicacions tècniques. Ideal per projectes petits o prototips.