budibase
budibase copied to clipboard
Creating dynamic form components
Discussed in https://github.com/Budibase/budibase/discussions/5640
Originally posted by cirillojon April 28, 2022 I am trying implement an order form where a user can input their own information while using the form and add new rows as they see fit without pulling data from a data provider. Currently we have a solution in a different workflow, but would like to implement it using budibase. Is there a functionality that can help us accomplish this?

Another related discussion here: https://github.com/Budibase/budibase/discussions/5189
Would being able to use App State as a source for a Data Provider allow you to accomplish this? I.e. update state with a JSON object that represents your form elements, and then use a repeater to add them.
Just to add to this, you would also need to allow form field names to be bindable for this to work. Alternatively you could auto append a number on the end of the name for each input added.

@melohagan thank you for the report (was looking to report the same). Did you happen to have reached a workaround that you can share?
Hi @suparagroup This is a workaround I had tried using Form Steps: https://github.com/Budibase/budibase/discussions/5640#discussioncomment-2662603
It's a stack though - so you can only add an element onto the end, and remove the last element. You also need to know the maximum number of inputs.
Making the form field names bindable would open up a lot of doors and make budibase a lot more powerful. +1 for that idea.
This issue has been automatically marked as stale because it has not had recent activity.
Not sure if it's in bad taste to resurrect this thread, but this would be a super powerful feature.
Actually there is a workaround using custom multi-picker as the data source. Although all subform elements need to be managed manually with onChange action (tedious as hell), everything is possible (unlimited subforms, adding, removing, re-ordering, etc.) I can share the how if anyone is interested.
@dannyshin76 Please do!
This issue has been automatically marked as stale because it has not had recent activity.
The field names should be bindable. +1
To add to this feature request further, it has come up a couple of times that users would like to be able to build Dynamic Forms from a JSON schema, such as from a REST query:
https://github.com/Budibase/budibase/discussions/10121
Hi @suparagroup This is a workaround I had tried using Form Steps: #5640 (comment)
It's a stack though - so you can only add an element onto the end, and remove the last element. You also need to know the maximum number of inputs.
Hello, brother.
How do I add a number after a field? I have N pieces of data that need to be rendered drop-down selection box, However, because the field names are the same, there is only one field when submitting the form. I tried to add q{{ Duties Repeater.Duties.Auto ID}} My ideal is = q1, but when I submit the form, I only have a value of q1.
Making the form field names bindable would open up a lot of doors and make budibase a lot more powerful. +1 for that idea.
This is a good function.
Is there a plan? @melohagan
users would like to be able to build Dynamic Forms from a JSON schema
@melohagan I listed a few open-source tools that might be useful for this functionality in https://github.com/Budibase/budibase/issues/10860 😄
I agree, this is needed. I want to be able to have the user add an extra row if they need to input another line item (we have multiple line item entries per form).
would the "bindable field name" be implemented in the future ? i have a survey page but when i get the question dynamicly using rest API i ran into the problem of submitting the answers since there's no way to differentiate which answer belong to which question, maybe i can work around it with JS array but it would change every questions's answer on display to the newly selected answer which will probably confuse the users.
+1 on this, it would be immensely useful.
Another discussion related to dynamic form components link here.