Topic: mdb-select with label value set via jQuery not visible
Expected behavior The text USA shows in the select box Actual behavior The label is visible Resources (screenshots, code snippets etc.)
The snipped below demonstrates the scenario. Removing the label exhibits the expected behavior. The desired behavior is to be able to leave the label attached.
https://mdbootstrap.com/snippets/jquery/bkowalczk/1181543
Hi bkowalczk,
I forked your snippet to show how you can generate a proper example for this 2 selects. First of all, when you are using labels inside of select and you want to create 2nd material select you have to use wrapper. We are creating MDBootstrap tool and your label has to be inside of proper bootstrap structure inside row and col to properly position on your desired selects.
I tried to serve your needs in this snippet.
I could misunderstand you. If you need additional help I am here for you.
Best Regards, Piotr
bkowalczk free commented 5 years ago
Thank you for your assistance Piotr. The HTML structure is better; however, the values set via jQuery are not visible, which is the larger problem. Based upon the jQuery code below, the select boxes should display Germany and USA, respectively but they are both empty in the snippet examples.
$('#cboOne').val("2"); // expected the select to change to Germany $('#cboTwo').val("1"); // expected the select to change to USA
Thanks in advance for any guidance you can provide on this issue.
MDBootstrap staff commented 5 years ago
I fixed my snippet example. It serves your needs right now. https://mdbootstrap.com/snippets/jquery/pjoter-2-0/1183915 You can prepare selectors depending on your HTML structure. This is just a working example. I noticed a few problems with this implementation and we will try to make it more developer-friendly in the future.
bkowalczk free commented 5 years ago
I appreciate that you recognize that this is difficult for developers. Hopefully, a developer-friendly solution can be found. To be clear, the use-case is to be able to set the active item by the option's value, not the text as shown in your snippet example because the value is all that is returned from the database. Ideally, a bridge would be constructed that allows the jQuery function $('#cboOne').val("2") to work as expected. Thank you.
MDBootstrap staff commented 5 years ago
We are on it. We will make it work like that.
FREE CONSULTATION
Hire our experts to build a dedicated project. We'll analyze your business requirements, for free.
Answered
- ForumUser: Free
- Premium support: No
- Technology: MDB jQuery
- MDB Version: 4.8.9
- Device: PC
- Browser: Version 76.0.3809.132
- OS: Win 10 x64
- Provided sample code: No
- Provided link: Yes