shadcn-ui / ui

Beautifully designed components that you can copy and paste into your apps. Accessible. Customizable. Open Source.
https://ui.shadcn.com
MIT License
75.74k stars 4.76k forks source link

Only first element of a form is sent via server action #2356

Closed NicoCaldo closed 9 months ago

NicoCaldo commented 10 months ago

I'm playing with Server action and I've noticed that just the first input of the form is sent on the server action. Using the code below, with several FormField, just the one is being sent to the server action

<Form {...form}>
      <form
        action={async (form: FormData) => {
          requestImg(form).then((imageStringify) => {
            const binaryData = Buffer.from(imageStringify.image);
            const imageBase64 = URL.createObjectURL(
              new Blob([binaryData.buffer], { type: "image/jpeg" } /* (1) */)
            );
            setSource(imageBase64);
            setOpen(true);
          });
        }}
        className="w-2/3 space-y-6"
      >

my server action looks like

export const requestImg = async (formData: any) => {
  const link = formData.post_link;

and from the console, I can see

FormData {
  [Symbol(state)]: [
    {
      name: 'post_link',
      value: 'https://abcd.com/2023/12/eric-prydz-call-on-me-beatport/'        
    }
  ]
}

Instead, if I use the example of the documentation

<Form {...form}>
        <form
          onSubmit={form.handleSubmit(onSubmit)}
          className="w-2/3 space-y-6"
        >
          <FormField

and then

function onSubmit(data: z.infer<typeof FormSchema>) {
    requestImg(data).then((imageStringify) => {
      const binaryData = Buffer.from(imageStringify.image);
      console.log(binaryData);
      const imageBase64 = URL.createObjectURL(
        new Blob([binaryData.buffer], { type: "image/jpeg" } /* (1) */)
      );
      setSource(imageBase64);
      setOpen(true);
    });
  }

I've the correct formField

({
  post_link: 'https://abcd.com/2023/12/eric-prydz-call-on-me-beatport/',       
  brightness: 33,
  contrast: 66,
  do_enhance: false,
  title_tag: true
})
NicoCaldo commented 10 months ago

Using ChatGPT for automatic answers don't help.

shadcn commented 9 months ago

This issue has been automatically closed because it received no activity for a while. If you think it was closed by accident, please leave a comment. Thank you.