我正在使用p:pickList
primefaces 中的组件,如图所示:
这是我的代码:
<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 库对选择列表中的元素进行分组?还是我必须重写这个组件才能达到这样的结果?