Multi-Select Not populating in Form

[mayraSanchez]

Hello!

We currently have a form that accepts multi-select and noticed that there was a similar posting in Febraury to the issue I am currently experiencing.

I currently have multiselect enabled and it works fine in the form but when i save the form and go back to it, the multi-select option is empty once again.

When submitting in the form:

Key value showing that the data is selected:

Once I go back to the form after submitting the modifications:

Essentially the data doesn't populate but when i check the database, the data is there.

Is there something I need to add to the default value to get it to show my previous selections?

Thanks!

[Oscar_Ortega]

Hello, if you want to keep the form data values after succesful submit, you need to uncheck the following option:

[mayraSanchez]

Hi Oscar,

I do not have that checkbox selected. I have other elements on the form that work completely fine (single select, and text field, and text area inputs). Everything else on the forms populates as it should.

When I select the form and look at the data values within that form, both marketplace_coverage and geos_jordan_coverage have their data in there.

Sadly, nothing shows on the form though despite seeing that the data is there in the backlog.

Also, not too sure if the data type that the column is will impact the results? This is what it looks like from the database side:

[Oscar_Ortega]

[Oscar_Ortega]

Just want to check
Does refreshing the page solves the problem?

[mayraSanchez]

Also, it is a manual value instead of mapped. Refreshing does not work. I have tried but that's always the constant that doesn't work (multiselect).

For the variable.value you used, what is your variable? I've tried doing the following and get an undefined variable:

(ciProductTable being the table the data is being pulled from)

[Oscar_Ortega]

i think is the way the value is stored

[mayraSanchez]

i went ahead and added the bracket to show it's an array but still the value isn't populating on the form. it shows the data that should be selected on the right but on the left, it is still showing up as blank.

[Oscar_Ortega]

Hey, this is kind of a workaround, i don't know if there is a better solution for this

put this as your mapped value for the table

{{ item.replace(/[,{}"]/g, "").split("") }}

[mayraSanchez]

That seemed to work only for the marketplace_coverage (kind of). Issue now is that the same values show each time for the marketplace_coverage for different products despite then having different values for the marketplace_coverage.

image of manual multiselect feature:

table edits:

With the geos_jordan_coverage, I can't get any of the tags to show in the selector despite there being data selected. Everything matches marketplace_coverage but it does not work.

[Oscar_Ortega]

Yeah, must be how the data is being stored

How data is being stored with {{ form1.data }} vs {{ multiselect1.value }}

I store the multiselect values as an array:

[Oscar_Ortega]

How is your data being stored

and how is being displayed on the table component?

[Oscar_Ortega]

You can change your column type to JSON and skip all data formating

Tags format for table column makes entire column blank

I have a table in the Retool Database that has a column that is populated by a form with a multi-select dropdown component, and in the Retool Database the column is formatted as a string that looks like this: ["item1","item2","item3"]. I want to display these three items as three tags in the column of the table that I have, but when I select the "tags" format for this column it makes the entire column blank. If I select string or tag, then it will display the whole list as one string or one item…

[mayraSanchez]

Data is being stored like you showed.

If I were to change the column type to JSON, would I do that in the database? At the moment i have several different types of formats that are primarily comma separated strings. Would I need to reformat them in order to allow the JSON to work?

This is where I would change the column type correct?

[Oscar_Ortega]

The easier way would be to store the data as a JSON, in this way you don't need to transform the data for the table and multiselect components, and you can keep your modifyProduct query as it is. But if reformat is not an option you will need to play with the data to make it work in all cases.

This is how the data is being stored in a JSON column using form1.data

[Oscar_Ortega]

@mayraSanchez

This is where I would change the column type correct?

yes

[mayraSanchez]

In that case I will need to convert the data prior to changing it to a JSON type because right now I get an error when trying to change it as it is now:
Error: invalid input syntax for type json

So the new format will be with just brackets([])? No more curly braces? ({})

Old format:
(empty)
All
NA; EMEA; APLA; Global
{"APLA","Big 4"}

New Format:
[]
["All"]
["NA", "EMEA", "APLA", "Global"]
["APLA","Big 4"]

[Oscar_Ortega]

yeah

[mayraSanchez]

okay. Prior to doing any of that, I created a test column and inserted a new multiselect option into the form.

The column:

The multiselect option:

The error message:

modifyProduct failed (0.445s):update "ci_product_inventory" set "product_description" = $1, "product_status" = $2, "product_name" = $3, "product_domain" = $4, "product_owner" = $5, "product_maturity" = $6, "product_type" = $7, "ci_team_squad" = $8, "subfunction_owner" = $9, "data_classification" = $10, "marketplace_coverage" = $11, "refresh_cadence" = $12, "product_family" = $13, "product_end_user_type" = $14, "product_end_user_group" = $15, "end_user_reach_if_available_for_dashboards" = $16, "data_environment" = $17, "schema_name" = $18, "table_name" = $19, "url_launch" = $20, "url_one_pager" = $21, "url_user_guide" = $22, "url_documentation" = $23, "data_captain" = $24, "tbl_simplified" = $25, "key_metrics" = $26, "notes" = $27, "geo_owner" = $28, "product_division" = $29, "filters" = $30, "geos_jordan_coverage" = $31, "personal_data" = $32, "multi_select_testing" = $33 where "id" = $34 returning * - invalid input syntax for type json```

[Oscar_Ortega]

Ah my bad, i forgot multiselect component returns it as {"value"}