Enable Users to Track Custom Data Points

I want to enable users to customize their platform, so that they can store the pieces of information they care about.

I have created these data types:
groupOfFields
-name
-description
-id

field
-label
-type
-groupID

value
-itemID
-textValue
-numberValue
-dateValue

I am generating a form for the users with the groupID that lists all the fields they created and corresponding inputs. To do this I am using a repeating to iterate through the list of fields and conditionally rendering the input type based on the field type. Because I am using a repeating group, I can’t access the values of the inputs inside the repeating group from event that occurs outside the repeating group.

The exception is in on the event When input changes. However, because the fields are custom, I don’t know what data type to expect, and so my value type has to have fields for all the accepted data types. Which means that I can’t use the information to from a single input of a single type to update form state of a value type.

Example:

The user creates a field of type number.
The form renders the input based on the type, that only accepts numbers.
When the input changes, the value returned is type number.
The workflow can not update the form state of value type, because they are not the same type.

This would be easier if I only had one field at a time, because I could have a form state for each base type, but I have a list of values to save at one time. So the problem of mapping the correct input values to each value instance’s correct field is the issue I can’t figure out.

How can I have a list of values of a dynamic type and stores those from users’ inputs?

I realized from experience that the best way to deal with dynamic user data types is to save the data in JSON or psuedo JSON. Then parsing the values to render appropriately.

Example of a pseudo JSON
{my name||text}{my age||number}{son|daughter|wife||list_text}
Split the values into a list using regex to extract each text from the {}. Then parse each line using the seperators || and | for lists.

I recommend storing in JSON for complex data. Loads of plugins that can parse JSON for rendering.

Does this work with files and images too? Especially lists of files and images?

Do you use a plugin with javascript to parse the json objects or Bubble’s built in features?

Plugins. It’s unfortunate that Bubble doesn’t support parsing JSON in the editor.

I used a work around that’s not that has a possibility for a memory leak as well as no validation, until I can get the JSON parsing to work. Just store the current custom values in an “originals” array, use Bubble’s copy a list of things and store those in a separate “updates” array. Connect the “updates” array to the inputs and enable auto binding. Delete the originals when the use clicks save, delete the updates when the user clicks cancel.