не могу поставить значок Bootstrap не работает в selectbox

Question

Когда я использую <i class="glyphicon glyphicon-leaf"></i>, он работает хорошо.

Но если я попробую его в Html SelectBox, он не будет работать.

<select title="Select your spell" class="selectpicker" data-show-icon="true">
    <option><i class="glyphicon glyphicon-leaf"></i>select</option>
    <option data-icon="glyphicon glyphicon-eye-open"><i class="glyphicon glyphicon-leaf"></i>1</option>
    <option data-subtext="<i class='glyphicon glyphicon-leaf'></i>">2</option>
</select>

Answer 1

Стандартный помощник выпадающего списка не поддерживает это, либо вы можете написать свой собственный помощник или использовать простой Html, как показано ниже.

<style>
select#dropdown option[value="1"]   { background-image: '';   }
select#dropdown option[value="2"]   { background-image: '';   }
select#dropdown option[value="3"]   { background-image: '';   }
</style> 

<select id="dropdown">

<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
</select>

Эта ссылка поможет написать свой собственный помощник

https://forums.asp.net/t/2130842.aspx?How+to+create+a+Dropdown+menu+with+image+icons+using+razor+

Answer 2

Вам нужно будет использовать j2-библиотеку select2, как упомянул @Guruprasad, или вы можете использовать это https://developer.snapappointments.com/bootstrap-select/

В ней есть несколько вариантов отображения значков или другой разметки HTML в select.

<select id="mySelect" data-show-icon="true">
  <option data-content="<i class='glyphicon glyphicon-cutlery'></i>">-</option>
  <option data-subtext="<i class='glyphicon glyphicon-eye-open'></i>"></option>
  <option data-subtext="<i class='glyphicon glyphicon-heart-empty'></i>"></option>
  <option data-subtext="<i class='glyphicon glyphicon-leaf'></i>"></option>
  <option data-subtext="<i class='glyphicon glyphicon-music'></i>"></option>
  <option data-subtext="<i class='glyphicon glyphicon-send'></i>"></option>
  <option data-subtext="<i class='glyphicon glyphicon-star'></i>"></option>
</select>

Демо: https://www.codeply.com/go/l6ClKGBmLS