DEV Community

Manav Misra
Manav Misra

Posted on • Edited on

3

Handling Form Submissions II

Leverage name

Previously, I advised against using name as it's mostly just clutter. But, now, we will actually want to use it. So, make sure that all of your inputs have a name attribute. Or, just use this Gist (includes HTML and CSS.

FormData

We simply pass our form into this constructor const myFormData = new FormData(form). However, if you console.log(myFormData) - it's just empty.

Don't fret. Read on.

There are many points regarding FormData and iterables covered in the docs.

The purpose of this post is to show how to convert your 'form data' into an object.

Object.fromEntries

Again, the docs contain more details and examples. All we need to know is that our FormData can be turned into an object literal like so: Object.fromEntries(myFormData). That's it.

Filling out demo form and logging the finished object in the console

Speedy emails, satisfied customers

Postmark Image

Are delayed transactional emails costing you user satisfaction? Postmark delivers your emails almost instantly, keeping your customers happy and connected.

Sign up

Top comments (0)

Sentry image

See why 4M developers consider Sentry, “not bad.”

Fixing code doesn’t have to be the worst part of your day. Learn how Sentry can help.

Learn more

👋 Kindness is contagious

Please leave a ❤️ or a friendly comment on this post if you found it helpful!

Okay