Topic: How do I set the mdb-select field from typescript while using reactive forms?
Expected behavior
When the user selects an object the object properties will then populate the fields.
Actual behavior
However, when using .setValue() to set the mdb-select field that field does not set itself to the selected option.
Resources (screenshots, code snippets etc.)
this.propertyForm.controls.testField.setValue(selectedObject.testFieldD.toString());
Below is a screen shot where you can see the input field populate correctly nut the mdb-select field still is blank.
Closed
This topic is closed.
FREE CONSULTATION
Hire our experts to build a dedicated project. We'll analyze your business requirements, for free.
Closed
- User: Free
- Premium support: No
- Technology: MDB Angular
- MDB Version: 8.0.0
- Device: Web
- Browser: Chrome
- OS: Windows 10
- Provided sample code: No
- Provided link: No
William White commented 4 years ago
So actually I answered my own question. Looked at the documentation for mdb-select and found this way of setting the field.
this.testForm = new FormGroup({ testSelect: new FormControl('1') });
Not sure if there is a better way about setting the value without re creating the form though?
https://mdbootstrap.com/docs/angular/forms/select-1/#docsTabsOverview
Arkadiusz Idzikowski staff commented 4 years ago
SetValue method should work correctly in this case. What is the exact value returned by this code
selectedObject.testFieldD.toString()?William White commented 4 years ago
@Arkadiusz Idzikowski I see why it was not working for me now. I forgot I had custom css on the .mdb-select class which was causing it not to populate in the UI. I took that custom css away and SetValue works correctly now.
Thanks for jogging my memory!