TanStack

TanStack is a community of passionate software engineers striving for high-quality, open-source software for web devs

Join

TanStack

TanStack is a community of passionate software engineers striving for high-quality, open-source software for web devs

Join

react-query-questions

solid-query-questions

table-questions

virtual-questions

router-questions

react-charts-questions

ranger-questions

vue-query-questions

svelte-query-questions

bling-questions

form-questions

angular-query-questions

start-questions

db-questions

start-showcase

router-showcase

📣-announcements

deep-jade

11/8/2025

What is the correct way to pass the useForm hook to another functional component in a separate file?

I have a case where I am using array mode of forms. I have various array form inputs, and I don't want to repeat typing them all in one file as They're all very similar aside from the label and the field name. Right now I create the form field component and then call it various times, passing form as a prop. Is this a correct patter? For example: ```jsx...

ugly-tan

11/6/2025

Error with Moment type

Hi, do you know why when i adding moment type in my

SortedFormValues

SortedFormValues

he throw a error ? Code : ```typescript import { useAppForm } from '@/context/FormContext';...

ugly-tan

11/5/2025

How to type formOptions

Hy everyone, someone can say me, if it's possible a type formOptions and if yes how to ? Code : ```typescript import { useAppForm } from '@/context/FormContext';...

stormy-gold

11/4/2025

AI modified field

When an AI assistant modifies a field I need to display a unique UI state. I can set value and manipulate the metadata on the field, is this OK? Should I add something to the field.store? Any other ideas? Thank you.

sunny-green

11/3/2025

Question about how to have components with multiple fields in them

Hello, i'm upgrading to v1, and in my App I have components that used to take a typed form as a prop, and then have many form.Field children, where the name field would be inferred. Is there anyway to have something similar in the new API, or what would be the next best thing ?...

ugly-tan

11/3/2025

Error with useForm : Type instantiation is excessively deep and possibly infinite

Hy everyone, i have a error with useForm when i want to make a form and definite in a context the error throw : Type instantiation is excessively deep and possibly infinite. Do you say how to resolve the error and where she come ? Code : ...

rising-crimson

11/3/2025

useStore causing weird behavior to form.reset()

reproduction: https://github.com/mamlzy/tanstack-form-repro

magic-amber

11/1/2025

How to use a Set in default values?

I am using Select from Hero UI, which uses a Set for its value. But when I do this, the schema validator types do not come out correctly. It seems they are transforming the types to be serializable, converting from Set to Array. Here's a mini code snippet to reproduce: ```typescript...

other-emerald

10/31/2025

Set error when onSubmit fails

Im desperately trying to make server validation work. I've tried to use formApi.fieldInfo.email.instance?.setErrorMap and formApi.setErrorMap inside onSubmit, but nothing seems to work. How to consistenly set an error the onsubmit fails?...

stormy-gold

10/30/2025

How do you pass the form via the context api?

To preface: This is probably not a great idea but I'm trying to experiment with context and the idea of compound components. I'm trying to pass the form produced by useForm() to a context provider with the goal of using the hook in child components, here's what I have so far: ```tsx...

extended-salmon

10/30/2025

Fields in the error state re-render when changing other fields?

Hey hey See here: https://codesandbox.io/p/devbox/frosty-shamir-23c7px?file=%2Fsrc%2Findex.tsx If you leave First Name blank and start typing in last name, it re-renders first name on every character, but if you put something in first name so its valid then type last name, it does not?...

wise-white

10/30/2025

A complex form with multiple actions

Hi everyone, I wanted your advice on should I use Tanstack Form for my form functionality I have defined below. The reason I am asking is because right now I am not using any form management library and handling all the error state and everything manually, but I am not able to resolve the re-render problem with it so it is making my form very slow when there are a lot of rows. The requirement for the form are: - I am making a timesheet form where the user has to fill in hours and comments for each day. - The form should be a table - Each row the user selects there project, and then from Monday to Sunday they fill in their specific hours and comments. - Many actions can be performed like fetching data from some other apis to create new rows in the table automatically, saving the table and submitting the table. - First the project line needs to be submitted then for each day an api call needs to be made to save the days. ...

absent-sapphire

10/29/2025

useStore vs withForm

Hey Guys, im really new to tanstack/form and i have a question regarding the usage of withForm. I am currently refactoring a feature where I fetch a set of data from my backend and the user can change fields of the fetched data with inputs. Currently it is one big useState and the onChange and the mutableDataObject is prop-drilled down to every component that needs to change the data. It is a multi-step "form". Really just fields on a Page the user can edit. Now to my question. If i wrap the whole page with my form and all steps are only conditionally rendered. What is the benefit of using withForm? I still need to prop drill the form instance to each component with or without the withForm HOC. Most of my Components currently need the whole dataObject to determine if it should render. I am currently getting the data from the useStore of the form and then rendering the fields as normal. ...

correct-apricot

10/28/2025

deriving field state value from bigger (field state?) objects

hello in my form i'd like to have an intermediate object between what i submit and what i display. Take the use-case of a "user search" input. you'd like to keep the whole user object in the field state to display the user name in the input, although you might want to submit (and validate) the user id only....

absent-sapphire

10/28/2025

Nextjs serverValidate doesn't return accurate typed-values

Hello, I followed this example to setup Nextjs backend validation https://tanstack.com/form/latest/docs/framework/react/examples/next-server-actions I'm using zodv4 for validations. The serverValidate has objectify-ed the array and stringify-ed the numbers as you can see in the screenshots. Have I missed something in the configuration ? Should I Object.values every array and parseFloat every number resulting of the validated data ? By the way, love this library so far and I really enjoy using it, thank you for it, keep up the very good work!...

optimistic-gold

10/28/2025

Button text not responding to isSubmitting

Hello. I have a sign in and sign up page. Both of the buttons are listening to isSubmitting/isValidating to change their text. But for some reason, only the signin button changes text, not the signup button.

harsh-harlequin

10/28/2025

Generic array field with form composition

How can I create a generic array field that can be used across different forms that are created using createFormHook? Eg. I want to create this array component: ``` import { withForm } from '../hooks/form';...

correct-apricot

10/28/2025

form composition with custom validation

I'm currently doing forms with custom (per field) validation with zod, which works kinda ok. typical pattern is: ```ts <form.Field name="name"...

helpful-purple

10/28/2025

Why my form from useAppForm is of any type even with defaultValues?

How do I get typesefety with form coposition?

sunny-green

10/27/2025

Exclude field from onSubmit and validators

Can I have a form field defined in defaultValues and use it in my code, but exclude it from the form onSubmit callback and exclude it from the validators? e.g: ```ts const form = useAppForm({ defaultValues: { quantity: defaultDeliveryNoteLineFormData.quantity as number | null,...

Previous Next

Gaming

Programming

TanStack

TanStack is a community of passionate software engineers striving for high-quality, open-source software for web devs

TanStack

TanStack is a community of passionate software engineers striving for high-quality, open-source software for web devs