Topic: mdb-select customizing text and value source properties
Is it possible to customize the mdb-select element to specify the fields that map to the text and value properties? For example, my data is currently:
var users=[
{"userid": 1, "fullname": "john doe"},
{"userid": 2, "fullname": "jane doe"}
]
I looked through your Vue Select documentation, also in the API section, but don't see how I might go about this.
Something I imagine working could be:
<mdb-select v-model="users" item-text="fullname" item-value="userid" />
Is that possible?
Thank you in advance.
You can specify both text and value for options in mdbSelect:
<mdb-select v-model="basicOptions" />
In this component, v-model modifies the array of options by adding selected: true flag.
basicOptions: [
{ text: 'Option nr 1', value: 'Option 1' },
{ text: 'Option nr 2', value: 'Option 2' },
{ text: 'Option nr 3', value: 'Option 3' },
{ text: 'Option nr 4', value: 'Option 4' },
{ text: 'Option nr 5', value: 'Option 5' , selected: true}
],
Further data modification is up to you - you can loop through data to get selected items and use value property instead of the text. Let me know if it solves your issue. KInd regards, Magdalena
FREE CONSULTATION
Hire our experts to build a dedicated project. We'll analyze your business requirements, for free.
Answered
- User: Free
- Premium support: No
- Technology: MDB Vue
- MDB Version: 6.1.0
- Device: Any
- Browser: Chrome
- OS: Windows 10
- Provided sample code: No
- Provided link: No