MDB-Select: Placeholder

pro asked 7 years ago

Hi. Is it possible to give a value for the placeholder? i would prefer if the "please choose" would be formatted like the placeholder in grey not in black. Thanks

Mikołaj Smoleński staff answered 7 years ago

Hi,

You can easily change the value of the placeholder inside input attributes:
<input placeholder="Your value" type="text" id="form5" class="form-control">

You can also change it's style like this:

input[type=text]::placeholder {
  color: black;
}
.md-form label {
  color: black;
}

Regards


pro commented 7 years ago

Thanks for your answer. Probably my question was not clear though. The MDB select looks like this in the HTML: <pre><select class="mdb-select"> <option value="" disabled selected>please choose</option> <option value="">aaaa</option> ... </select></pre> The Code in the browser looks like this: <pre><div class="select-wrapper mdb-select initialized"><span class="caret">▼</span> <input type="text" class="select-dropdown" readonly="true" data-activates="select-options-31ce51dc-b839-12ef-8336-cf51e4dbabe1" value="please choose"> <ul id="select-options-31ce51dc-b839-12ef-8336-cf51e4dbabe1" class="dropdown-content select-dropdown" style="width: 480px; position: absolute; top: 0px; left: 0px; opacity: 1; display: none;"> <li class="disabled"><span>please choose</span></li> <li class=""><span>aaaa</span></li> ... </ul> <select class="mdb-select initialized"> <option value="" disabled="" selected="">please choose</option> <option value="">aaaa</option> ... </select> </div></pre>   I would like the "please choose" to appear in the placeholder instead of the value: <pre> <input type="text" class="select-dropdown" readonly="true" data-activates="select-options-31ce51dc-b839-12ef-8336-cf51e4dbabe1" placeholder="please choose"></pre>

Mikołaj Smoleński staff commented 7 years ago

Unfortunately there is no way to put placeholder into mdb-select. Regards

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