Topic: Using Multiselect with Reactive Forms and updatedOn property doesn't work
                  
                  dimitribocquet
                  pro
                  asked 7 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);
}
}
                
                  
                
                
                
                  
                  
                  
                    
                    
                
              
              
              
            
                      
                        Add comment
                      
                    
                  
                
                      
                      Arkadiusz Idzikowski
                      staff
                        answered 7 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
                    
                      
                    
                    
                    
                    
                  
                  
                FREE CONSULTATION
Hire our experts to build a dedicated project. We'll analyze your business requirements, for free.
Status
              Answered
Specification of the issue
              - ForumUser: Pro
- Premium support: No
- Technology: MDB Angular
- MDB Version: -
- Device: -
- Browser: -
- OS: -
- Provided sample code: No
- Provided link: No
Tags