Help with Form Select Field - does not render at all with MD

  1. MDB Home Page
  2. Support Main Page
  3. General Bootstrap questions
Topic: Help with Form Select Field - does not render at all with MDB CSS!

alvintng pro asked 7 years ago

Hi All, the HTML of my code is as follows: <select name="name_placeholder" id="id_placeholder"><option value="False" selected="">Text for False</option><option value="True">Text for True</option></select>However this is incompatible with MDB and it renders empty. Could I ask how can I make this compatiable with MDB by changing CSS? This is automatically rendered by Django.

Marta Szymanska staff pro premium answered 7 years ago

Hi, try this code: <select class="browser-default" name="name_placeholder" id="id_placeholder"> <option value="False" selected="">Text for False</option> <option value="True">Text for True</option> </select> Best, Marta

fredemagi pro commented 7 years ago

Hi Marta, I encounter the same issue when using a simple select like: <pre><select class="mdb-select"> <option value="" disabled selected>Choose your option</option> <option value="1">Option 1</option> <option value="2">Option 2</option> <option value="3">Option 3</option> </select> <label>Example label</label></pre> I have investigated the mdb.css file, and it strikes me that the rule for select is set to display: none !important;. How is the select supposed to work then? Mine does not show at all. Regards, Frederik

Marta Szymanska staff pro premium answered 6 years ago

Hi, .mdb-select also doesn't work even if you initialize it: https://mdbootstrap.com/javascript/material-select/? I'm not sure what is your goal if it is to use our material select or use default Bootstrap select? Please, describe it. Best, Marta

fredemagi pro commented 6 years ago

Hi Marta, I got it working by initializing it. Thanks. Properly forgot to read that part. I'm facilitating Material select. Regards, Frederik

Marta Szymanska staff pro premium commented 6 years ago

OK, great.
Write
Create snippet
Please insert min. 20 characters.

FREE CONSULTATION

Hire our experts to build a dedicated project. We'll analyze your business requirements, for free.
Status

Answered

Specification of the issue
  • User: Pro
  • Premium support: No
  • Technology: General Bootstrap questions
  • MDB Version: -
  • Device: -
  • Browser: -
  • OS: -
  • Provided sample code: No
  • Provided link: No
About author
alvintng
Pro User
50Support score
11Questions 5Answers
0Snippets likes 0Snippets