How to change default material select dropdown icon?


Topic: How to change default material select dropdown icon?

Sanches asked 5 years ago

MDB PRO has a perfect material select but I would like to change default drop down icon

<div class="select-wrapper mdb-select md-form">
    <span class="caret">▼</span> // !
    // I would like to replace icon with other one from fontawesome

For this I've changed mdb.js file's code:

this.$dropdownIcon = this.options.defaultMaterialInput ? "" : $('<span class="caret">▼</span>')...

To the following:

this.$dropdownIcon = this.options.defaultMaterialInput ? "" : $('<span class="caret"><i class="fas fa-angle-down"></i></span>')...

But it's not changing the icon. How can I do that? Thanks beforehand!

P.S.I'm using mdb pro JQuery version 4.11


Grzegorz Bujański staff commented 5 years ago

Hi.

Try this: this.$dropdownIcon = this.options.defaultMaterialInput ? "" : $('<span class="caret fas fa-angle-down"></span>');

Best, Grzegorz


Sanches commented 5 years ago

Thank you! Worked =)


Grzegorz Bujański staff commented 5 years ago

No problem :) Best, Grzegorz.


How to do this in Angular MDBootstrap Pro?


Grzegorz Bujański staff commented 3 years ago

Do you mean MDB4 Angular or MDB5 Angular?


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: MDB jQuery
  • MDB Version: 4.11.0
  • Device: Desktop
  • Browser: chrome
  • OS: Windows 10
  • Provided sample code: No
  • Provided link: No