通过单击 p:tab 在 JSF 中呈现一个 PanelGroup

Question

目前我有一个用 JSF 开发的前端，它加载了太多数据，这并不是在所有情况下用户都需要，这个提到的数据除以基于一个条件呈现的选项卡“”：

<p:tab id="summary-tab2" title="Tittle of tab"
                            rendered="#{(myBean.SomeCondition)}">
<ui:insert name="summary-tab-characteristics">
        <h:panelGroup id="panelData">
          <ot:otherJSF id="otherHtml"  application="#someBean}"/>
        </h:panelGroup>
    </ui:insert>
</p:tab>

在许多情况下，用户不需要查看该选项卡内的信息，因此当且仅当用户单击 "Summary-tab2" 选项卡。

我该怎么做？

Answer 1

如果您使用的是 PrimeFaces 的 TabView 组件，只需将动态属性设置为 true 即可。

Dynamic Tabs

There’re two toggleModes in tabview, non-dynamic (default) and dynamic. By default, all tab contents are rendered to the client, on the other hand in dynamic mode, only the active tab contents are rendered and when an inactive tab header is selected, content is loaded with ajax. Dynamic mode is handy in reducing page size, since inactive tabs are lazy loaded, pages will load faster. To enable dynamic loading, simply set dynamic option to true.
<p:tabView dynamic="true">
//tabs
</p:tabView>

还有面板：

    <p:panel collapsed="true" header="title" toggleable="true">

        <f:ajax event="toggle" listener="#{bean.makeTheConditionTrue()}"render="@this" />

        <ui:fragment rendered="#{bean.condition}">

            //your content

        </ui:fragment>

    </p:panel>

但是通过这种方式，内容将在每次切换事件时更新。我不确定你想要那样的东西。

通过单击 p:tab 在 JSF 中呈现一个 PanelGroup

render a PannelGroup on JSF tiggered by click on p:tab

html

jquery

jsf

jsf-2.2