Multi select form validation

Ionic Framework ionic-v3
1

When using a multi select in a form, it is not validating correctly.
What is the current way, with RC2 to use ‘required’ on a multi select?
Sample below:

    <ion-select multiple="true" (ionChange)="showSelectValue(age)" #age [class.invalid]="!slideOneForm.controls.age.valid" ngControl="age">
                            <ion-option *ngFor="let item of ageList" value="{{item.value}}" selected="{{item.checked}}">{{item.text}}</ion-option>
                    </ion-select>

And in my formBuilder.group:
age: ['', Validators.required]

2 Likes
2

This seems to be partially working:

this.MyForm = formBuilder.group({
      age: ['this.profile_data.age', this.validator]
    });

multiValidator(ctrl: FormControl) {
  if (!ctrl.value || ctrl.value === false) {
      return { 'invalidMulti': true };
    } else {
      return null
    }
};

And adding ‘formControlName’ in the html:

<ion-select multiple="true" (ionChange)="showSelectValue(age)" #age formControlName="age" ngControl="profile_data.age">
                            <ion-option *ngFor="let item of ageList" value="{{item.value}}" selected="{{item.checked}}">{{item.text}}</ion-option>
                        </ion-select>

But, the selected value is not tying into ‘profile_data’ object.
eg: this.profile_data.age should be what the selection is.

2 Likes
3

Same here, can’t validate a . I tried ‘required’ and ‘minlength()’ but doesn’t seem to affect. The result is always not valid.