[Feature]: Remove selected option in the 'Select' column type in Table Widget

[JoshuaCMcMahon]

Is there an existing issue for this?

• [X] I have searched the existing issues

Summary

When a Table row is being updated, either in single or multi-row mode, the user should be able to clear the currently selected value in a Select column type. Currently there is only a way to select a different value from a dropdown when editing, but if you want to remove a value it is currently not possible in the same way that it is in the Select widget.

Why should this be worked on?

Typcially if I use the Select widget, if there's a currently selected item you get the option to remove it by clicking on the X next to the item's label. This doesn't appear to be implemented in the Table widget when you've made a column editable and set the column type to Select (it works exactly like the select widget, but there's no option to "clear" the value).

I've found a workaround where you simply inject an additional property with label: "(None)" and value: "", but this seems less than ideal and request that it matches the same functionality of the Select Widget as that's the feature it is emulating.

[somangshu]

@keyurparalkar is the select component not the same as the select widget component? Whats the effort for that change?

[dilippitchika]

We were thinking about it when we added the solution, we felt supporting the none use-case in the select widget was an overkill, which is why we didn't add it.

The bigger thing was i believe that we had to implement an error state for select if it was marked as required and someone sets none.

[somangshu]

@dilippitchika I did not get why its an overkill? Engineering wise or UI/UX wise? In the above use case, if the field is required and the users clears the value, it should show a error state, and if that is not acceptable to us, we could also make a core change where the clear icon only appears if required is false.

[keyurparalkar]

@keyurparalkar is the select component not the same as the select widget component? Whats the effort for that change?

@somangshu yes, table widget uses same component as that of select widget's component. The effort should be low without error state handling mentioned by @dilippitchika

Need to triage bit more in terms of error handling scenario mentioned above

[dilippitchika]

Inside the table's cell there are 3 states in total

1. Default state - This is when there's some data already on the cell
2. Editing state - This is when the user is editing the content of the cell
3. Updated state - This is when the user has updated and cleared all validations set in the editing state and now the cell data is updated and ready to save

With the input in table, any validation error is caught in the editing state, when the user is typing and wants to update the cell by clicking outside.

With the select in table, the editing state is when the dropdown is open. When selection happens the dropdown has to close, changing state to updated state. When we enable remove an option and it's required, we need to handle the error in the edited state. This is the nuance here.

We can get away from this nuance by hiding the remove option when the column is marked as required.

[somangshu]

We can get away from this nuance by hiding the remove option when the column is marked as required

Should we go this way then @dilippitchika @keyurparalkar ?

[dilippitchika]

We can but i don't think i would prioritise this above other issues in the table widget for now.