Select all on multi-select component?

App Building
,
#1

Hey there,
Does anybody know of a way to add a "Select all" option to the multi-select component?

Thanks!

#2

A separate button to set the value to "all" might work more easily than a "Select All" option within the component.

Only reason I say this is that although adding a new value to a list is quite straightforward, I think that treating it as a "special option" will be quite a bit of effort and tracking the user interaction with it and state management will be even more effort.

As a query it should be simple enough to set it to "all" using this kind of logic:
multiselect1.setValue(multiselect1.data.map(x=>x.value))

1 Like
#3

Thanks @dcartlidge - That query didn't quite do the trick. Maybe I need to keep playing with it.

#4

Try to make a JS query with just this and attach a button (like @dcartlidge suggested) to it:

your_multiselect_component.setValue(your_multiselect_component.values);

The .value would give you just the value(s) selected (which is useless to you here). BUT the plural .values gives all the options. So you can set the value (using .setValue) to all the values. See?

#5

Thanks @mathfour that worked. Would be nice if it was an option on the component.