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.
- If there is an error saving the line then the error should be shown at the line level. If it is there when saving on a day it should be on day level.
- Also during the submit action, I get an error from the server if any of the lines (of the table) are not submitted due to some reason. In that senario I need to show the user what is the error only for that row.
- I am maintaining additional variable fetched, edited and deleted at the line and at the day level to make sure which api to call when actually update the data at the backend.
- I am not maintain Local State at the input level as to sync with the actual main array I will have save it when the user unblurs from the input field. I have given the users a shortcut to save the table and I want it to happen even when the user has focused in a input box.
- There is no validation happening on the client side all of it is being done on the server side.
- 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.
- If there is an error saving the line then the error should be shown at the line level. If it is there when saving on a day it should be on day level.
- Also during the submit action, I get an error from the server if any of the lines (of the table) are not submitted due to some reason. In that senario I need to show the user what is the error only for that row.
- I am maintaining additional variable fetched, edited and deleted at the line and at the day level to make sure which api to call when actually update the data at the backend.
- I am not maintain Local State at the input level as to sync with the actual main array I will have save it when the user unblurs from the input field. I have given the users a shortcut to save the table and I want it to happen even when the user has focused in a input box.
- There is no validation happening on the client side all of it is being done on the server side.
