Topic: Material select: How do I display custom text for selected option?
I have a really simple select
<select class="mdb-select md-form">
<option value="1" data-display-value="text 1">Very very long text 1</option>
<option value="2" data-display-value="text 1">Very very long text 2</option>
<option value="3" data-display-value="text 1">Very very long text 3</option>
</select>
Which is then converted to material select by $(select).materialSelect();
So far so good, I open the drop down, and the "Very very long text" s show up. But when I choose one of these, I want the select to display the content of data-display-value and not the inner text of the option. How can I achieve this?
I managed to write a (nasty) workaround for my own problem, and have created a snippet here:
https://mdbootstrap.com/snippets/jquery/studioinsight/643734
MDB is a really powerful tool, it saves lot of time of front-end coding and styling, but it yet still lacks of many functionalities that lets your customers customize their components.
While looking at the documentation I was crazily looking for a list of options to be passed to the materialSelect() but failed, so I hope in the future some will be added, including the display member feature (C# developers will feel me)
FREE CONSULTATION
Hire our experts to build a dedicated project. We'll analyze your business requirements, for free.
Resolved
- User: Free
- Premium support: No
- Technology: MDB jQuery
- MDB Version: 4.7.7
- Device: Mobile first
- Browser: Any possibly
- OS: Any
- Provided sample code: No
- Provided link: No