Berkay Demirbasberkay.fyi
FEBRUARY 12, 2021

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.

1 min read

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

Like this:

Dynamic Netlify Form Titles

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}/>`
Berkay DemirbasBerkay Demirbas · FEBRUARY 12, 2021