TanStackT
TanStack•2y ago•
15 replies
accused-moccasin

Issues with Next.js server actions and TanStack Form

I some issues with TanStack Form and Next.js server actions. I was following this guide: https://tanstack.com/form/latest/docs/framework/react/guides/ssr

First issue:
Docs show how to validate data but what should I do to go further (e.g save valid data to database)?
I tried to use 
onSubmit
 prop in createServerValidate but it never fires.
I also thought that maybe I should get form values from FormData inside server action but it feels bad because I already had access to those values inside onServerValidate.
Also why result of createServerValidate is returned to client right away:
export default async function someAction(prev: unknown, formData: FormData) {
  return await serverValidate(formData)
}

I don't understand how should the flow look like.

Second issue:
formState.isSubmitting is never true. No matter how long server action lives, it is never showing submitting status.
Only If I add 
onSubmit
 to 
useForm
 and run some async code in here then formState.isSubmitting goes true.

Third issue:
When I hit submit button then it goes to server action even tough client validation failed. Shouldn't it only go to server if client validation succeded?
Was this page helpful?