Igx combo select all item

[MarcoGuzzetti]

Hi all,
I need to select all items in the combobox. I want to add an item named something like "Select all" to the dataset and clicking on it must select (or deselect) all items.

The combo summary text also need to be something like "All items selected" and not "item1, item2,...".

There is a a workaround for this?

Thank you.

[ViktorSlavov]

Hi @MarcoGuzzetti

For the Select All part, you can use the igxHeaderTemplate directive to create a custom header. Here is a StackBlitz example.

For the templating of the summary text, we will have to explore a couple of options:

1. Exposing an input that would control the text only (so changing it to Item 1, Item 2,.. will not select items)
2. Exposing a directive that would allow templating of the combo input (likely not possible, because igxInput requires a igx-input-group parent)
3. Exposing a directive that would allow templating of the combo whole input-group (likely not feasible, because it would requires all of the binding and buttons to be templated as well)
4. Exposing a formatting function that the summary text is passed through and can override the text as needed
5. Exposing the summary text in the onSelectionChange emitter, so users can override it as needed

[StefanIvanov]

@ViktorSlavov the UX team feels that the first option gives optimal UX and the default value for it should be "All items selected"

[damyanpetev]

So 2 and 3 are out on account of the current igxInput/Combo template implementation. That leaves 1 and 4/5 (those are very very similar).

@StefanIvanov If the text is a property, it's either text in general (can't have default value, still requires event to assign when needed) or allSelectedText which is a bit narrow functionality as it basically covers just this case.

Beyond use cases with a few selected items, the default text isn't too great since you can't see most of the selection and I imagine something like "55 out of 400 selected" as a reasonable scenario.

I'm actually partial to the event option (5) since it's the natural entry point to figure out what the text should be anyways. The event arguments provide the would-be selection and would-be text and it shouldn't be too much custom code to change the text based on the selection. I'll also be fairly simple change for the Combo too.