Formulieren
Kant-en-klare contact-, offerte-, boekings- en registratieformulieren. De AI plaatst er een met één component — geen submit-handler om te schrijven — en elke inzending belandt in de inzendingsinbox van je app.
Formulieren in Proyecta zijn een capability, geen iets dat de AI handmatig codeert. Wanneer je app een manier nodig heeft voor bezoekers om contact op te nemen — een contactformulier, een offerteaanvraag, een afspraakboeking, een event-aanmelding — zorgt Proyecta voor een kant-en-klare formulierdefinitie die wordt weergegeven via een template-owned block. Validatie, de successtatus, opslag van inzendingen en de eigenaarmelding zijn allemaal inbegrepen.
De presets
Section titled “De presets”Elk formulier begint vanuit een van de vijf ingebouwde presets. Beschrijf het formulier dat je wilt en Proyecta kiest (en past) de juiste aan — je bouwt nooit velden van scratch.
| Preset | form api id |
Waarvoor | Combineert met |
|---|---|---|---|
| Contact | contactForm |
Algemeen “neem contact op”: naam, e-mail, optioneel telefoon, bericht | Bedrijfsinfo |
| Offerte | quoteForm |
Offerteaanvraag: contactgegevens + welke dienst + taakdetails | Diensten |
| Boeking | bookingForm |
Afspraak: dienst, gewenste datum & tijd, contactgegevens | Diensten |
| Registratie | registrationForm |
Event- of cursusaanmelding (RSVP): deelnemersgegevens + een opmerking | Evenementen |
| Bestelling | orderForm |
Bestelopname: wat de klant wil, contactgegevens, notities | Menukaart, catalogus |
Je kunt meerdere formulieren in één app hebben (bijv. een contactformulier en een boekingsformulier), en de AI kan velden op elk van deze formulieren toevoegen, hernoemen of aanpassen.
Hoe de AI het aansluit
Section titled “Hoe de AI het aansluit”De AI bouwt nooit handmatig een formulier of een submit-handler. Ze plaatst de template-owned <FormBlock/> en verwijst naar een formulier via id of api id:
import { FormBlock } from '@/components/blocks/FormBlock';
// Anywhere on a public page — a contact section, a "request a quote" panel, etc.<FormBlock form="contactForm" />;<FormBlock/> regelt alles zelf:
- Rendert velden per type — tekst / e-mail / telefoon als invoervelden, lange tekst als een textarea, keuzes als een dropdown, opt-ins als een checkbox, datums en tijden als native pickers, en bestandsvelden als een “bestand bijvoegen”-besturingselement.
- Valideert in de browser — verplichte velden worden gecontroleerd voordat er iets wordt verstuurd.
- Valideert op de server — als de server een waarde afwijst, verschijnt de specifieke fout inline naast dat veld (geen verloren inzendingen, geen stille fouten).
- Toont een successtatus — na het verzenden wordt het formulier vervangen door een vriendelijke bevestiging (het eigen bevestigingsbericht van het formulier) met de mogelijkheid om nog een reactie te sturen.
- Faalt veilig — als het formulier niet bestaat of is gedeactiveerd, rendert het block niets, zodat het nooit een publieke pagina kan breken.
Omdat het block template-owned is, hoeft de AI het alleen maar te plaatsen en de omliggende sectie op te maken — de achterliggende infrastructuur is vast en correct.
Bestandsbijlagen
Section titled “Bestandsbijlagen”Formulieren kunnen een geüpload bestand accepteren (een bon, een referentiefoto, een briefing). Bestandsvelden tonen een knop “bestand bijvoegen”, uploaden het bestand naar opslag en plaatsen de publieke URL in de inzending. Limieten worden automatisch afgedwongen:
- Alleen afbeeldingen en PDF, tot 5 MB (grote afbeeldingen worden eerst in de browser verkleind).
- De verzendknop is uitgeschakeld terwijl een bestand wordt geüpload, zodat een inzending nooit half-voltooid wordt verstuurd.
Waar inzendingen naartoe gaan
Section titled “Waar inzendingen naartoe gaan”Elke inzending wordt opgeslagen en verschijnt in de inzendingsinbox van je app — onderdeel van het beheerderspaneel, weergegeven door de <SubmissionsInbox/> van de template. Van daaruit kun jij (de eigenaar):
- Inzendingen bekijken onder de tabbladen New / Read / Archived, met een ongelezen badge bij New.
- Een inzending openen om de ingediende veldwaarden, de pagina waarvan het afkomstig is en de datum te bekijken.
- Een inzending als read markeren, terugzetten naar new of archiveren.
- De inbox filteren op één formulier, of alle inzendingen van elk formulier in één lijst bekijken.
De inbox is alleen toegankelijk voor beheerders — de lezer moet ingelogd zijn met een beheerdersaccount (afgedwongen op de server).
Een e-mail ontvangen bij elke inzending
Section titled “Een e-mail ontvangen bij elke inzending”Formulieren kunnen je per e-mail op de hoogte stellen wanneer iemand een formulier instuurt — schakel eigenaarsmeldingen in en stel het adres in dat ze moet ontvangen. Je ontvangt de lead in je inbox zonder de app te openen. De e-mail zelf wordt verstuurd via de e-mail-capability van Proyecta, dus het werkt zonder extra instellingen.
Veelvoorkomende patronen (laat de AI het aansluitwerk doen)
Section titled “Veelvoorkomende patronen (laat de AI het aansluitwerk doen)”"Add a contact form to the footer with name, email, and message, and email me at hello@mybiz.com whenever someone submits.""Put a 'Request a quote' form on each service page that asks which service they need and the job details.""Add a booking form so clients can request an appointment with a preferred date and time.""Create an event registration form for the workshop page and let attendees attach a PDF.""Show me the submissions inbox and only the ones I haven't read yet."
Gerelateerd
Section titled “Gerelateerd”- Contentbeheer — formulieren leven naast je collecties in hetzelfde contentmodel.
- Beheerderspaneel — waar inzendingen worden beoordeeld.
- E-mails — hoe e-mails voor eigenaarsmeldingen worden verstuurd.