1. MDB Home Page
  2. Support Main Page
  3. MDB jQuery
Topic: Append copy of MDB select not working i 4.8.10+

lassekofoed free asked 4 years ago

Expected behavior When cloning a html select element and calling .materialSelect() on the new object. The select box shows and can be used like a normal materialselect element.

Actual behavior From version 4.8.11 and forward the new object are show, but can not be unfolded

Change log describes Major changes to material select component in change log https://mdbootstrap.com/docs/jquery/changelog/#v4-8-11

Please advise

lassekofoed free answered 4 years ago

After testing, i presume that [ ] and . is not allow in the Id field ? I can work around this i my setup, but HTML5 states that ALL chars are valid, so I would say this is a bug ?

Also can you link to a page descripting the $('#${ID}') never seen this before, and google is not helpful.

Mateusz Łubianka staff commented 4 years ago

Do you mean using variable in the string in this way? It's Template strings: https://developer.mozilla.org/pl/docs/Web/JavaScript/Referencje/template_strings

Best,

Mateusz Łubianka staff answered 4 years ago

Hi @lassekofoed,

I changed a few things in your code.

clone.getElementsByTagName("select")[0].setAttribute("id", x);

And:

$(`#${x}`).materialSelect();

Check it.

Best,

lassekofoed free answered 4 years ago

The Change log for 4.8.11 states

nativeID has been renamed to selectId

And that lead me to trying things with the id attribute. a problem that i found is : if I set a Id on the cloned mdb-select element is does not work. So removing the setAttribute("Id","myid[" + x + "]) makes the mdb-select work. But that leads to if i dont set one on the clone, the id from to prototype is reused on all mdb-select elements. And this makes all selection in applied to the right select element.

So for now here is a working example with no ID on the clone and no id on the prototype https://mdbootstrap.com/snippets/jquery/lassekofoed/1667277

FREE CONSULTATION

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

Closed

Specification of the issue
  • ForumUser: Free
  • Premium support: No
  • Technology: MDB jQuery
  • MDB Version: 4.12.0
  • Device: All
  • Browser: Chrome 79 - Firefox 72 - Egde
  • OS: All
  • Provided sample code: No
  • Provided link: Yes
Tags
select
About author
lassekofoed
135Support score
9Questions 9Answers 8Snippets