Using Multiselect with Reactive Forms and updatedOn property


Topic: Using Multiselect with Reactive Forms and updatedOn property doesn't work

dimitribocquet pro asked 6 years ago

I use updateOn (blur) property on my Reactive Form, and the multiselect doesn't update the values. But without updateOn, it works. Of course, I'd like to make it work with updateOn property. Here is my code : <form [formGroup]="form" (ngSubmit)="onSubmit()"> <div class="md-form"> <mdb-select ngDefaultControl [options]="optionsSelect" [multiple]="true" placeholder="Choose an option" formControlName="options"></mdb-select> </div> <div class="text-center"> <button class="btn btn-default waves-light" mdbWavesEffect [disabled]="form.invalid" >Submit</button> </div> </form> <pre> {{ form.value | json }} </pre> export class MyComponent implements OnInit { optionsSelect = [{ value: '1', label: 'Today' }, { value: '2', label: 'Yesterday' }, { value: '3', label: 'Last 7 days' }, { value: '4', label: 'Last 30 days' }, { value: '5', label: 'Last week' }, { value: '6', label: 'Last month' } ]; form: FormGroup; constructor( private _fb: FormBuilder, ) { } ngOnInit() { this.initForm(); } initForm() { // updateOn issue : https://github.com/angular/angular/issues/19163#issuecomment-396947839 const tmpFGroup = this._fb.group({ options: [[], []], }); // Works this.roleModelForm = new FormGroup(tmpFGroup.controls); // Doesn't Work // this.roleModelForm = new FormGroup(tmpFGroup.controls, { updateOn: 'blur' }); } onSubmit() { console.log('submitted', this.form.value); } }

Arkadiusz Idzikowski staff answered 6 years ago

Dear dimitribocquet, Thanks for letting us know, we will take a look at this problem and try to fix it in the near future. Best, Arek
Please insert min. 20 characters.

FREE CONSULTATION

Hire our experts to build a dedicated project. We'll analyze your business requirements, for free.

Status

Answered

Specification of the issue
  • User: Pro
  • Premium support: No
  • Technology: MDB Angular
  • MDB Version: -
  • Device: -
  • Browser: -
  • OS: -
  • Provided sample code: No
  • Provided link: No