PrimeFaces p：autoComplete：显示所有结果的编号

Question

在我的网络应用程序中，我有一些输入值，用户应该从大型现有列表中选择一个项目（＆gt; 2000项）。对于那么多项，常规p:selectOneMenu不适合，因为渲染的HTML变得很大。所以我决定改用PrimeFaces UI组件p:autoComplete。

为确保快速响应时间，我使用附加属性maxResults来限制autoComplete组件中的建议数量。 这很有效，我看到的唯一问题是，用户可能没有意识到这样的事实，可能会有比建议列表中显示的结果更多的结果。
因此，例如用户开始输入，我的完整方法返回50个结果，但由于maxResults的值，只显示10个结果。我想要的是用户的一些可视化，其中发现了40多个结果。

我是如何实现这一目标的？

参考文献：PrimeFaces p:autoComplete

Answer 1

我可以想到两种选择。

moreText属性和component隐式对象

使用隐式对象component，您只需阅读建议数量：

<p:autoComplete completeMethod="#{settings.autoCompl}"
                moreText="Total found: #{component.suggestions.size()}"/>

或者：

<p:autoComplete completeMethod="#{settings.autoCompl}"
                moreText="#{component.suggestions.size() - component.maxResults} more..."/>

另见：

• What exactly is #{component} in EL?

OmniFaces＆＃39; resolveComponent

如果您想完全自定义，可以使用OmniFaces resolveComponent。使用已解析的组件，您可以再次阅读建议数量：

<p:autoComplete id="autoComplete" ...>
  <p:ajax event="query" update="found"/>
</p:autoComplete>
<o:resolveComponent name="ref" for="autoComplete"/>
<h:outputText id="found"
              value="Total found: #{ref.suggestions.size()}"/>

如果要在建议列表附近显示文本，可以合并一些JavaScript：

<p:autoComplete id="autoComplete" ...>
  <p:ajax event="query" update="more"/>
</p:autoComplete>
<o:resolveComponent name="ref" for="autoComplete"/>
<h:panelGroup id="more">
  <h:panelGroup rendered="#{not empty ref.maxResults and
                            ref.suggestions.size() gt ref.maxResults}">
    <script>
      $(document.getElementById('#{ref.clientId}_panel')).append(
        '#{ref.suggestions.size() - ref.maxResults} more...'
      );
    </script>
  </h:panelGroup>
</h:panelGroup>