Add a Select all to a ionic-select box

Ionic Framework ionic-v3
1

Right now we have a multi-select box. They wanted some way to add a select all to it.
I knew the select box used some alert values so my original idea was to add a third button that would toggle the list, either select them all or deselect them all.

Not as easy as I would like. Even though the documentation for ion-select does say it uses the options that alert controller has, there is no way that I can see to add or even change the buttons. (only the title).

Next is adding in an extra row with this.
(ionSelect)="selectAll($event)

As far as I can tell this only gets called when the checkbox is being checked, when it gets unchecked it doesn’t fire.
Is there an easy way to do this?

2

Not that I’m aware of. I think you would have to completely roll your own.

3

Not what I wanted to hear.

I do find it strange that (ionSelect) only fires when the item is getting checked. Should this fire both ways?
I guess for some reason my expectation is the user clicks the check box, ionSelect fires either with a true or false or checked or unchecked, some value on what just happen.

4

Sort of depends on what you mean by “should”. If you mean “is it supposed to work that way?”, no:

   // Only emit the select event if it is being checked
   // For multi selects this won't emit when unchecking
   if (selectedOption.checked) {
     input.ionSelect.emit(input.value);
   }
5

Thanks for the info. I don’t know if that is ionic code? But looking at that it wouldn’t be that hard to add another if statement. I’m assuming checked is a boolean. true for being checked false for being unchecked. I know I’m not seeing the full picture.

6

The word “no” is a hyperlink.