Search code examples
phphtmlfont-awesomeglyphicons

glyph icon in html select not working

I am trying to get a from select to display a glyp icon before the category name. The category name shows fine. I cannot get the glyph icon to show up. It works outside the option, but cannot get the icon into the drop down menu.

Thanks in advance. Here is where I am at

<option \>Select</option>
  <?php
do {  
?>
  <option value="<?php echo $row_event_cats['cat_id']?>"><i class="fa fa-leaf"></i><?php     echo $row_event_cats['cat_name']?></option>
  <?php
} while ($row_event_cats = mysql_fetch_assoc($event_cats));
  $rows = mysql_num_rows($event_cats);
  if($rows > 0) {
      mysql_data_seek($event_cats, 0);
      $row_event_cats = mysql_fetch_assoc($event_cats);
  }
?>
</select>
Solution

  • The Dropdown menu will only display text. But the Glyphicon tag <i class="fa fa-leaf"></i> contains no text, so it won't be displayed. You can maybe try to find a glyph library which actually uses chars and not class, but I can't think of any rght now. Let me search a few seconds.

    EDIT

    It appears that it is impossible to do with the "standard" HTML toolkit. If you're using Bootstrap, check http://silviomoreto.github.io/bootstrap-select/

    If you're not, check http://ivaynberg.github.io/select2/