UI table



is there any way to clear the selection of a table widget in the UI ?

When I click on a row I want to hide the table and show some details , but then I want to clear my selection and go back to the original list without any selection.

Is this possible ?



1 answer

This one is the BEST answer!

For the table and the data table you have a property called "Selected row". You can have a variable that will have the default value "undefined" and then in the hidden field of the table have a check if the variable is defined and have a container that will be shown when the selected row is defined.
Unselecting the row depends on the design you have. I prefer a button in the container that will make the selectedRow variable undefined.
The easiest way to do this is to have a variable called "actions" that will contains an array of actions to do. When the user will click the button, you should "Add to collection" a value like "deselect row". Now, you need a variable that will listen on this array and will have something like this code:

if($data.actions && $data.actions.length > 0) {
if ($data.actions[0] === "deselect row") {
$data.selectedRow = undefined;
$data.actions = [];

The code says that if there is an action to execute in the array and if the action is deselect row, then you should clear the selectedRow. It also clears the actions array so that this gets executed only once.

Hope this helps.


Submitted by abernasc on Wed, 10/14/2020 - 11:47

Thanks a lot it works !

Open to share whatever can be useful for you