Next.js Discord

Discord Forum

Why is my form action passing an empty object to my server action?

Answered
Yellow Crazy Ant posted this in #help-forum
Open in Discord
Yellow Crazy AntOP
I must be going crazy but I thought this simple example should log all the values in my form, but what happens is the formData object is always an empy object,

export default async function ContactPage() {
  const create = async (formData: FormData) => {
    'use server'
    console.log(JSON.stringify(formData, null, 2))
  }

  return (
    <main>
      <form action={create}>
        <label htmlFor='name'>Name</label>
        <input type='text' name='name' />
        <label htmlFor='email'>Email</label>
        <input type='text' name='email' />
        <label htmlFor='message'>Message</label>
        <textarea name='message' />
        <button type='submit'>Submit</button>
      </form>
    </main>
  )
}


"next": "v14.0.0",
Answered by Ray
try
console.log(JSON.stringify(Object.fromEntries(formData), null, 2))
View full answer

1 Reply