CODEWITHSUNDEEP
jqueryhtml
Rifat
Rifat

Reputation: 27

How to select font awesome icon from options

<select id="dropdown">
    <option> <i class="fa fa-wifi"></i> </option>
    <option> <i class="fa fa-battery-full"></i> </option>
</select>
<div id="feedback"></div>

When any one of the option is selected, how can I show the selected font awesome icon in feedback div using jQuery.

Upvotes: 0

Views: 487

Answers (1)

Cagri Tacyildiz
Cagri Tacyildiz

Reputation: 17610

https://jsfiddle.net/r62p5zas/ example code is here In html part u need to integrate and change font of select with font awesome then u chan show icons in select item 

select{
        font-family: fontAwesome
    }

After that u can give onchange event to your select and give value as font name and u need to write code of fonts in options.

<select id="dropdown" onchange="chantestge()">

    <option value='fa-wifi'>&#xf1eb; Wifi</option>
     <option value='fa-battery-full'>&#xf240; Battery</option>
</select>
<div id="feedback"></div>

then is js part u can use jquery and with html code put your result with create icon

function chantestge(){

  $("#feedback").html("<i class='fa "+$("#dropdown").val()+"'></i>");
}

Upvotes: 1

Related Questions