Topic: MDB Select, searchable, cannot activate search input

saburo premium asked 2 years ago

I am adding dynamycally selects to a modal div, selects work, but the search option is not clickable, nor editable. I have seen some solution with .focus, but did not appear to do anythng tfor me, plus the code in those solution is quite old and did not run as is in my situation.

this is part of the code I use :

   case "category":
            var catData = await mdm.getCategoryValues(fld.categoryId),
                options = { filter: true , displayedLabels : 9, formWhite : true};
            mdmField = $("<select/>", { class: "select mdmField mdmCategory", id: "fld_" + fld.categoryId })
            $("<label/>", { class: "form-label select-label", text: fld.description }).appendTo(container);
            if (!fld.isMandatory) {
                $("<option/>", { value: "", text: "--- N.A. ---" }).appendTo(mdmField);
                options.clearButton = true;
            } else $("<option/>", { value: "", text: "--- Please Select a Value ---" }).appendTo(mdmField);
            Object.keys(catData.values).forEach(cval => {
                //TODO: manage hierarchies
                $("<option/>", { value: cval, text: catData.values[cval].description }).appendTo(mdmField);
            if (mdmField.length == 1) {
                new window.mdb.Select(mdmField[0], options);
                mdmField[0].addEventListener("", (ev) => validateEditForm(container ,;

abd this is whay=t I get ( the search-input is inactive, checked properties in chrome dev tools, cannot see anything weird)

enter image description here

Mateusz Lazaru staff answered 2 years ago

saburo premium answered 2 years ago

Yes, it worked!

Basically I had to set the data-mdb-container property to the select object. I tried via APIs passing it as container, but that did not work.

mdmField = $("<select/>", { class: "select mdmField mdmCategory","data-mdb-container":"#modalEditBody", id: "fld_" + fld.categoryId })

Please insert min. 20 characters.


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



Specification of the issue

  • ForumUser: Premium
  • Premium support: Yes
  • Technology: MDB Standard
  • MDB Version: MDB5 4.1.0
  • Device: PC
  • Browser: Chrome
  • OS: Win 10
  • Provided sample code: No
  • Provided link: No