1

我正在使用p:pickListprimefaces 中的组件，如图所示： 在此处输入图像描述

这是我的代码：

    <p:pickList id="cityPicklist" rendered="true" var="city"
                    style="font-size: 11px" effect="bounce" itemValue="#{city}"
                    converter="cityConverter" itemLabel="#{city}"
                    showSourceControls="true" showTargetControls="true"
                    showCheckbox="false" responsive="true" showSourceFilter="true"
                    showTargetFilter="true" filterMatchMode="contains"
                    value="#{myView.cities}">

        
                    <p:column style="width:100%">
                        <h:outputText value="#{city.name}" />
                    </p:column>

                </p:pickList>

我想要实现的是以下结果：

在此处输入图像描述

但是从 primefaces 生成的代码会为来自myView.cities.

<div class="ui-picklist-list-wrapper">

<ul class="ui-widget-content ui-picklist-list ui-picklist-source ui-corner-all 
    ui-sortable" role="menu" tabindex="0">

<li class="ui-picklist-item ui-corner-all ui-sortable-handle" 
    data-item-value="San Francisco" data-item-label="Europe" 
    role="menuitem" style="
    font-weight: bold;
    margin-left: 1;"> Europe</li>

<li class="ui-picklist-item ui-corner-all ui-sortable-handle" data-item-value="London" 
    data-item-label="London" role="menuitem" style="
    margin-left: 20px;
">London</li>

<li class="ui-picklist-item ui-corner-all ui-sortable-handle" data-item-value="Paris" 
    data-item-label="Paris" role="menuitem" style="
    margin-left: 20px;

...

有没有办法使用 primefaces 库对选择列表中的元素进行分组？还是我必须重写这个组件才能达到这样的结果？

4

0 回答 0