[Feature]: Add options for labels in select columns in a table widget

[GreenFlux]

Is there an existing issue for this?

• I have searched the existing issues

Summary

The table widget now supports the Select column type, which allows the column to contain both a label and a value. This could be useful for currency fields, foreign keys, or any other case where you want to display a different version of the column value. However, there is a problem with sorting.

With Select columns in a table widget, the label is shown to the user while selecting an option, but then the value is shown in the table widget, after the option has been selected. This is different from the behavior of a Select widget outside a table, which continues to show the label after an option has been selected.

Feature Request:
To address this inconsistent behavior, and add support for sorting currency values, we should allow the user to choose:

1. Display as? [label | value ]
2. Sort by? [label | value ]

Why should this be worked on?

Multiple users have asked for a way to support a currency column in the table widget that both sorts and displays accurately. For now, users have to choose between displaying as a number (that sorts property) or as text with currency symbol (which sorts incorrectly).

#5632
https://discord.com/channels/725602949748752515/1076320585002532976
https://discord.com/channels/725602949748752515/1074651219588558868

Front conversations

[ghost]

It would be useful if it would still use the value when interacting with table data programmatically, even if DisplayAs is set to label.

[somangshu]

@keyurparalkar @momcilo-appsmith should this be prioritized?

[benjamindonze]

More generally the select widget is not consistent regarding label / value.
Let say I have a DB table car and a DB table color. Car has a FK to table color.
I want to create a table to edit cars. My table widget is populated with query:
SELECT id, brand, model, color_id FROM car;
with inline editing configured as https://app.appsmith.com/app/editable-table/cell-save-62d8f8d0e1c2ed505a0557cd.
In the color column I set the widget type to select.
I let value of properties Computed Value to {{currentRow.color_id}} and set the Select properties options with data of this query:
SELECT id as value, name as label FROM color;
then here is current behavior:

• When displaying the table the column color shows the FK id. NOK Would expect to show the label of the color.
• When editing column color the dropdown shows the label values. This is OK
• When editing column color the value hold by currentRow.color is the id of the color. This is OK
• When editing column brand the value hold by currentRow.color is the id of the color. This is OK

Trying to solve this problem if I change Computed value property to display the color name with something like:
{{SelectColorQuery.data.find(color => color.value === currentRow["color_id"]).label}}
then I get the following behavior:

• When displaying the column color it shows the the label. This is OK
• When editing column color the dropdown shows the label values. This is OK
• When editing column color the value hold by currentRow.color is the id of the color. This is OK
• When editing column brand the value hold by currentRow.color is the color label. NOK

[keyurparalkar]

CC: @dilippitchika

[sapusi]

Hi, I'd like to know if there's been any development about this issue. The bug blocking it appears as completed. Like many noted, I also consider this feature a must, because it makes tables way more flexible. Thanks in advance for the implementation.

Hi,
I have the same question and issue as @lau-st and @oxamo
@dilippitchika , is there any work planned on this topic? Thank you !

[ame-appsmith]

Another user asked for this feature.

[kgfnz]

Hi,
For a relational database this is a must so that ids arent seen. Without this the table isnt useful for any edits.
Thanks

[GreenFlux]

Another user on Discord is facing this issue.

It limits the possibility to use table inline editing because now I need to provide a special form where and only where a user could add/edit values. Or consider using poor database design "label = value" but it can cause troubles in the future. It would be very nice of you if you make it possible to always display cells as labels, as well as in inline Select lists, but write values.
https://discord.com/channels/725602949748752515/725609493974614076/1240548925539225621

[daaliachhak17]

Do we need to work on this issue? can we have the exact steps to reproduce the issue along with screenshots or a loom video ?

[benjamindonze]

Please do work on it. What is not clear to you?

[acreacico]

As a workaround solution:

1. Hide the "value" column in the table.
2. Set the "label" column type as Select.
3. Set the column's Options source as the needed value-label object.
4. In the update query refer to the "label" column as the new value (instead of the "value" column, which is the intuitive way).
   Further is business-as-usual.

[benjamindonze]

Yes that work around works though it is a work around, it is not so intuitive and I believe this is a basic feature that should work for select widget. Actually it works for select widget outside of datatable I think.

[sapusi]

In my understanding, this is linked to #26855 which is closed by now.

In #26855 , there was the following request:

is this PR ready for productive deployment and can it be merged into release?
Can you please launch that process to close #21993 and #26188 ?

Could you maybe review that PR if it is suitable to close this issue ?

[benjamindonze]

I don't feel comfortable enough to implement myself this fix I think.

[sapusi]

Could you maybe review that PR if it is suitable to close this issue ?

I don't feel comfortable enough to implement myself this fix I think.

Sorry @benjamindonze , I did not mean you.
I meant to ask if this PR could be included into the main software branch, e.g. by @daaliachhak17 .

[benjamindonze]

Thanks it seems indeed now the behavior is what would be expected. Though I will have to fix all the workaround I was making by displaying a computed value beeing the label value which now doesn't work anymore my column displayed empty as the widget expect to find the value and not the label.

Just so you know this means this is not backward compatible with previous behavior

[benjamindonze]

@jacquesikot Ah also it seems the search bar of the datatable now doesn't work with that solution. Indeed search seems to be applied on the value field though it should also search on the label field

[benjamindonze]

I have opened an issue : #35406