Topic: Re-initialising material select does not re-connect label

tblfounder pro asked 5 years ago


Hi, I have a material_select object with an associated label and no options initially. I dynamically set its options then re=initialize it using $('.mdb-select').material_select('destroy'); $('.mdb-select').material_select(); This results in the select being displayed with the first of the options selected, yet the label is permanently displayed within the select area - underneath the selected option text. Selecting another option does not result in it moving above the select control as expected. Is there something that can reconnect the operation of the label to the re-initialised select? Regards

Adrian Sawicki free answered 5 years ago


Hello, If I properly understood your explanation, the only problem is the order of your declarations. material select init -> material select destroy -> append your options -> material select init again. About the first option it will always be selected because it's like a placeholder/instruction for a user. How I've checked it: HTML:

<div class="col-md-6">
    <select class="mdb-select"></select>
    <label>Example label</label>
</div>
JS:

$(document).ready(function() {

    $('.mdb-select').material_select();
    $('.mdb-select').material_select('destroy');

    $('.mdb-select').append($("<option> test1 </option>"));
    $('.mdb-select').append($("<option> test2 </option>"));

    $('.mdb-select').material_select();

});
If it doesn't help or in some way I misunderstood you, give me a bit more information of what you would like to do and I'll try my best to help you.

mejia_09 pro commented 5 years ago

Hello, i have the same problem, after re-initialize material select the label is in front of select, i did what you say but still not working here is an image with the problem http://res.cloudinary.com/dnofvcpys/image/upload/v1507845719/material-select_oct25d.png -the material select is in a modal


Please insert min. 20 characters.

FREE CONSULTATION

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

Status

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
Tags