Holiday Notice: Support will be provided on a limited scale from December 24th, 2024, to January 2nd, 2025. Happy holidays and a wonderful New Year!


Topic: How do you add font awesome icons as a select list option with text next to it?

kylebehse pro asked 5 years ago


I need to add font awesome icons to the options of a select list (dropdown). How would one do that? Thanks!


cdenby pro answered 4 years ago


Why does data-fas-classes exist in the https://mdbootstrap.com/docs/jquery/forms/select/#select-options-and-attributes page? How do you use this?


Grzegorz Bujański staff commented 4 years ago

I answered you here: https://mdbootstrap.com/support/jquery/how-do-you-add-font-awesome-icons-as-a-select-list-option-with-text-next-to-it/


kylebehse pro answered 5 years ago


Any one interested? I did this:
var theOptions3 = [];
$('.select option').each(function( index ) {
var theHTMLString = $( this ).data('content');
var theObject = new Object();
console.log(JSON.stringify(theObject));
theOptions3.push(theObject);
console.log( index + ": " + $( this ).data('content') );
});
$('.mdb-select ul.dropdown-content li').each(function( index ){
var theInsert = theOptions3[index].html;
$(this).find('span').html(theInsert);
});


Bartłomiej Malanowski staff commented 5 years ago

Thank you for sharing!



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

  • ForumUser: Pro
  • Premium support: No
  • Technology: MDB jQuery
  • MDB Version: 4.5.6
  • Device: Desktop
  • Browser: Chrome
  • OS: Mac OS
  • Provided sample code: No
  • Provided link: No