Adding a class to a select option


Topic: Adding a class to a select option

accounts@freshcut.biz asked 6 years ago

Is it possible to get material select to copy the classes that have been applied to the <option> elements of the original select?


Sebastian Kaczmarek staff pro premium answered 6 years ago

It looks like we have overlooked this. We'll fix that for sure.

If you don't want to wait for the fix, you can work around this by modifying `buildSingleOption(...)` method in the `material-select.js` file. Please find the similar line:

this.$materialOptionsList.append($(`<li class="${disabled} ${optgroupClass}">${iconHtml}<span class="filtrable">${checkboxHtml} ${fa} ${$nativeSelectChild.html()}</span></li>`));

And change it to something like this one:

this.$materialOptionsList.append($(`<li class="${disabled} ${optgroupClass} ${$nativeSelectChild.attr('class')}">${iconHtml}<span class="filtrable">${checkboxHtml} ${fa} ${$nativeSelectChild.html()}</span></li>`));

(simply add `$nativeSelectChild.attr('class')` to the `<li>` class list). Then you will have to recompile and re-minify the package to have it in your mdb.min.js file. You can also do exactly the same thing directly in your mdb.js and then re-minify the file to have it in the mdb.min.js file. 


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: Free
  • Premium support: No
  • Technology: General Bootstrap questions
  • MDB Version: -
  • Device: PC
  • Browser: Chrome
  • OS: Win8
  • Provided sample code: No
  • Provided link: No
Tags