Как показать длинный текст в select и option без сокращений, Select2 - усовершенствованные списки

03.10.18 ИТ / JavaScript 4546

Зачастую возникает потребность разместить на странице сайта элемент для выбора значения из списка. Значения в таком списке могут иметь длинные названия и бывает необходимо, чтобы они показывались без сокращений. Стандартными средствами простых select данная проблема не решается, но можно решить ее другими способами.

Итак, как показать длинный текст в select и option? Для этого можно использовать эмуляцию списков при помощи HTML, CSS и Javascript. А можно использовать готовый инструмент, к примеру плагин Select2.

Select2 – это плагин для библиотеки jQuery, который имеет богатые возможности для создания усовершенствованных списков. Среди его возможностей стоит выделить некоторые:

• поиск среди значений по ключевым словам;
• всплывающие подсказки при наведении;
• полное отображение всего текста в раскрытом списке без сокращений;
• удобная реализация работы с мультивыбором;
• загрузка данных в списки при помощи AJAX;
• возможность динамического добавления новых элементов;
• возможность создания группировки по уровням и т.д.

Скачать плагин можно с официального сайта, там же можно найти инструкции по подключению и настройке. Чтобы изменить внешний вид списка, достаточно просто применить стили CSS. С помощью данного плагина создание усовершенствованных списков станет совсем простой задачей.