T
TanStack5mo ago
fascinating-indigo

Using hidden fields

Can't seem to find how you handle a hidden field that has a value set "inside" the field and not on the default values. Use case i'm iterating over "delete" buttons and want to have a form for each thats initialized outside the UI, but with a hidden value corresponding to that "Delete" action. Is there a simple way to achieve this with tanstack forms?
6 Replies
metropolitan-bronze
metropolitan-bronze5mo ago
I see a bunch of Delete-Buttons and when I click one something should be set in the background? For TSF it should not matter if the fields are in the DOM, are visible or not. You show be able to just set the value using on of the two methods: https://tanstack.com/form/latest/docs/reference/classes/fieldapi#setvalue https://tanstack.com/form/latest/docs/reference/classes/formapi#setfieldvalue
fascinating-indigo
fascinating-indigoOP5mo ago
more of, are any form values allowed to be set in the UI and not in the initializer, i might have some react UI logic that i want to use to set the values. In normal form we use <input type="hidden" for that onClick to set is kind of a last resort backup
metropolitan-bronze
metropolitan-bronze5mo ago
So you want to enrich your form data with some additional information when the user clicked one of the delete buttons? When does that happen? On Submit? Why not keep the additional data stored outside the form and enrich your data in the onSubmit-function? So only put the ID you need to match the data in your Form-Data.
fascinating-indigo
fascinating-indigoOP5mo ago
yea it's just weird to not support the "hidden" field, as it's pretty typicals to get access to the form data from iterating over some UI. But i did add it to onSubmit to go over the forms hidden fields and manually add them to the submission, just a little hacky thank you for your feedback!
metropolitan-bronze
metropolitan-bronze5mo ago
Hidden fields are supported, TSF doesn't care if you show the Fields to the user or not - it's headless (so somewhat "hidden" by default). I think you're saving yourself some trouble by adding the data in onSubmit as you do not need to think about how you validate the data etc.
fascinating-indigo
fascinating-indigoOP5mo ago
well it's more of adding the values to the form on the UI level vs the data level, it will completely ignore the values in my form unless they are set with the defaultValues, which is kind of the point of having a hidden field for me. again nothing that is stopping me from using it, just extra level of complexity for something that was simple before

Did you find this page helpful?