Как применить стиль к иерархическому выпадающему списку в XPages

У меня есть comboBox в XPages, который показывает иерархический список категорий и значений, заполняемых как вектор в SSJS.

Теперь я хочу применить таблицу стилей (выделенную полужирным шрифтом) к категориям (т.е. только к категориям сгенерированных тегов параметров)

введите здесь описание изображения

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

Как мне это сделать?

спасибо

Томас

 UPDATED MY QUESTION WITH A WORKING CLASS

Имитирует категоризированное представление с 3 столбцами в поле со списком, категорией, меткой и значением.

public class Utils {

    public static List<SelectItem> getGroupedComboboxOptions() {

        try {

            Database db = ExtLibUtil.getCurrentDatabase();
            View vv = db.getView("ProdukterByCat");

            Vector v = vv.getColumnValues(0);
            List<SelectItem> groupedOptions = new ArrayList<SelectItem>();
            SelectItemGroup group;

            for (int i = 0; i < v.size(); i++) {

                List<SelectItem> options = new ArrayList<SelectItem>();
                group = new SelectItemGroup(v.get(i).toString());
                ViewEntryCollection nvec = vv.getAllEntriesByKey(v.get(i), true);
                ViewEntry entry = nvec.getFirstEntry();

                while (entry != null) {

                    SelectItem option = new SelectItem(entry.getColumnValues().get(2).toString(),entry.getColumnValues().get(1).toString());
                    options.add(option);
                    entry = nvec.getNextEntry(entry);
                }
                group.setSelectItems(options.toArray(new SelectItem[options.size()]));
                groupedOptions.add(group);
            }
            return groupedOptions;

        } catch (NotesException e) {
            e.printStackTrace();
        }
        return null;
    }

}

введите здесь описание изображения


person Thomas Adrian    schedule 02.10.2018    source источник


Ответы (1)


Поле со списком в XPages отображается с использованием HTML-тега select. Если вы организуете параметры в optgroup (см. также Заполняя selectItems поля со списком (метка, значение) с помощью управляемого компонента), вы сразу же получаете некоторые стили по умолчанию. Пример здесь.

Вы даже можете применить к ним дополнительные стили с помощью стандартного CSS, настроив optgroup. Но поддержка этого ограничена: например, это не работает на iPad.

Если вам нужен больший контроль над тем, как выглядят ваши раскрывающиеся списки, я бы посоветовал использовать плагин, например Select2.

person Mark Leusink    schedule 02.10.2018
comment
Марк попал в точку, я использовал Select2 раньше, а также optgroups, и они будут делать именно то, что вы хотите... - person Howard; 03.10.2018
comment
спасибо, отлично работает. Я обновил свой вопрос с решением - person Thomas Adrian; 05.10.2018