Select icons

Categories

Component ID

2647746

Component name

Select icons

Component type

module

Maintenance status

Development status

Component security advisory coverage

not-covered

Downloads

686

Component created

Component changed

Component body

This module provides Forms API select element with icons utilising jQuery UI.

This module is for developers only. It does not provide any user functionality.

You'll love it if you're a developer. With Select icons you can easily create select element with icons of your choice using nothing but drupal Forms API and some CSS:

$form['fancy_select'] = [
  '#type' => 'select_icons',
  '#title' => t('Color'),
  '#options' => [ 'r' => t('Red'), 'g' => t('Green'), 'b' => t('Blue') ],
  // This is where magic happens:
  // CSS classes from 'data-class' attribute are used in JavaScript
  // when building jQuery UI selectmentu widget.
  '#options_attributes' => [
    'r' => new Attribute([ 'data-class' => ['colour', 'red'] ]),
    'g' => new Attribute([ 'data-class' => ['colour', 'green'] ]),
    'b' => new Attribute([ 'data-class' => ['colour', 'blue'] ]),
  ],
  // Don't forget to add proper CSS that will provide icons.
  // It is recommended to use sprite sheets for better performance.
  '#attached' => [ 'library' => ['my/colours'] ],
];

Modules that use Select icons

  • Flags module to support select list with flag icons for Country field and Language fields
  • If you know any module that uses it, please let us know.