p:selectOneListbox 滚动到预选项目

Question

在 PF8.0 中，我有以下片段：

<p:selectOneListbox widgetVar="wgtListBox" filterMatchMode="contains" filter="true" value="#{serviceController.city.id}">
  <f:selectItems value="#{cityController.cities}" var="city" itemLabel="#{city.name}" itemValue="#{city.id}"/>
</p:selectOneListbox>

列表中有大约 20 个城市。

当用户第一次选择城市时（通过键入 and/or 滚动），逻辑是有意义的。但是，当页面加载用户可能希望修改的预选项目时，我希望滚动到该选定项目。我怎样才能做到这一点？

Answer 1

给你的列表框一个像这样的 widgetVar..

<p:selectOneListbox widgetVar="wgtListBox" ..

然后在 Chrome 控制台中打开 F12 并键入此...

PrimeFaces.scrollInView(PF('wgtListBox').listContainer,
                        PF('wgtListBox').jq.find('.ui-state-highlight'));

使用 Javascript 滚动到焦点项目。

p:selectOneListbox 滚动到预选项目

p:selectOneListbox Scroll to Pre-Selected Item

primefaces