Creating Dynamic Form Titles for Netlify Form

This simple solution is mostly using Netlify Forms for different event post based serialize sign-up forms in React.

Like this:

Firstly you have to create a form-name with form.getAttribute('name') for fetching.

fetch('/', { method: 'POST', headers: { 'Content-Type': 'application/x-www-form-urlencoded' }, body: encode({ 'form-name': form.getAttribute('name'), ...state, }), })

Add the form name as your title props to your form's name attribute like {eventDate}.

<form name={`${eventDate} Event Signup Form`} method="POST">

And add your Form component to your generated markdown files place.

So, you can use your any event post's frontmatter field as your form title 🎉.

<FormComponent eventDate={post.frontmatter.eventDate}/>