Topic: How Do I Get the Selected Item (Object) of Mdb-select
                  
                  The Orange Dev House
                  pro
                  asked 7 years ago
                
How do I get the selected item (object)? The same object passed in
                      
                      Damian Gemza
                      staff
                        answered 6 years ago
                    
The (selected) event returns the whole selected object, so in your example: {value: 1, label: 'America'}.
You can bind this value to some variable, and after clicking some button or something else you can return this variable.
I have provided you with two possibilities, how to achieve your desired behavior.
If you want something else, for now, this is not possible.
Best Regards,
Damian
                      
                      The Orange Dev House
                      pro
                        answered 6 years ago
                    
I am aware of ways to get the selected value. What I want is the selected 'item'. This should return the corresponding object literal: { value: 1, label, 'America', states: [] }.
                      
                      Damian Gemza
                      staff
                        answered 6 years ago
                    
Please note, that our business hours are 7-18 GMT+1. So only between this hours, you'll get the answer on our Support Forum.
Premium supports got the highest priority in replying.
About your problem: Please check our Select Documentation for Reactive Forms get selected value.
Best Regards,
Damian
                      
                      The Orange Dev House
                      pro
                        answered 7 years ago
                    
That does not show what I want. Currently, your sample is setting a module level variable within the handler with the $event object passed in. This is not what I want.
I want to access the selected item from say a button when it is clicked.
Something like onButtonClicked() {
const selItem = this.form.get('birth_country_id').selectedItem();
console.log(selItem ); // Result: {value: 245, label: 'Canada', moreProperty: 'morePropertyValue', ...}
}
The Orange Dev House pro commented 6 years ago
Six hours and no response from your team! And this is a premium account.
                      
                      Damian Gemza
                      staff
                        answered 7 years ago
                    
I don't know if I understood you right, but: do you want to achieve something like this?
.html:
<div class="row">
<div class="col-md-6 mx-auto my-5">
<mdb-select [options]="optionsSelect" (selected)="optionSelect($event)" placeholder="Choose your option" label="Example label"></mdb-select>
<p>selected option value: {{selectedOption.value}}, selected option label: {{selectedOption.label}}</p>
</div>
</div>
.ts:
optionsSelect: Array<any>;
selectedOption: any = {value: '', label: ''};
ngOnInit() {
this.optionsSelect = [
{ value: '1', label: 'Option 1' },
{ value: '2', label: 'Option 2' },
{ value: '3', label: 'Option 3' },
];
}
optionSelect(event: any) {
console.log(event);
this.selectedOption = event;
}
Best Regards,
Damian
FREE CONSULTATION
Hire our experts to build a dedicated project. We'll analyze your business requirements, for free.
Answered
- ForumUser: Pro
 - Premium support: No
 - Technology: MDB Angular
 - MDB Version: 6.2.1
 - Device: Laptop
 - Browser: Chrome
 - OS: Windows 10
 - Provided sample code: No
 - Provided link: No