shadcn Form
Hello im having two forms made with shadcn components and react-hook-from Controller for validation
The idea is when u fill the first form and submit it. The second form takes the first one place.
I added a cancel button to take the user back to the the first one . I want it with all the fields filled up with the previous data but idk how to do it through the controller.
That's a code snippet.
5 Replies
If I understand what you're trying to achieve, you want a multi step form, there are multiple ways of doing it, by changing routes within a layout, using only one form provider and rendering each step according to some state.
This is a simple example generated by chatgpt
Well the multi step form is well handled in my case. I just want to make the first form preserve the data in the input fields.
But with the use of shadcn components
So when the user hit the cancel button he'll find his previous data filled in the inputs instead of re-typing it
you're handling with multiple forms, you must be using multiple uses of
useForm
, in that case, if you're removing the entire form between each step, you can save that form data using local storage and on hit cancel, you get that data from local storage and set to the form.
But in my opinion, it would be much easier to just have one form, and change only the inputs of the form on each step. That way, the form will have the data when the user hits cancel, shouldn't require any extra code.Well i did it in another way using a useState but idk how to make the data show again in the inputs
I would avoid doing separate forms for each case and just rely on the useFormContext instead. If you decided to cache them into state or local storage you’ll just have to pass them into defaultValues and that’ll set up the state to be what it was originally