ui:repeat或c:forEach中的PrimeFaces p:accordionPanel [英] PrimeFaces p:accordionPanel inside ui:repeat or c:forEach

问题描述

我正在尝试创建多个accordionPanel. 我试图将此标签包含在重复元素中(例如c:forEach). accordionPanel的渲染效果很好，但是我无法从一个选项卡切换到另一个选项卡.

I'm trying to create multiple accordionPanels. I tried to include this tag inside repeat elements (e.g. c:forEach). The accordionPanel is well rendered, but I'm unable to switch from one tab to another.

这些是我尝试过的一些代码:

These are some codes I tried:

<ui:repeat value="#{myBackingBean.myList}" var="o">
    <p:accordionPanel dynamic="true" cache="true" multiple="true" widgetVar="accordion">
        <p:tab title="Title 1">
            #{o.data_one}
        </p:tab>
        <p:tab title="Title 2">
            #{o.data_two}
        </p:tab>
    </p:accordionPanel>
</ui:repeat>

还有

<c:forEach items"${myBackingBean.myList}" var="o">
    <p:accordionPanel dynamic="true" cache="true" multiple="true" widgetVar="accordion">
        <p:tab title="Title 1">
            #{o.data_one}
        </p:tab>
        <p:tab title="Title 2">
            #{o.data_two}
        </p:tab>
    </p:accordionPanel>
</ui:repeat>

这两个代码都生成一个accordionPanel的列表，每个列表都有两个选项卡. 但是我无法从一个选项卡切换到另一个选项卡:如果单击一个选项卡，则该选项卡不会打开或关闭(最后一个accordionPanel除外).

Both of these codes produces a list of accordionPanels, each with two tabs. But I'm unable to switch from one tab to another: If I click one tab it does not open nor close (except for the last accordionPanel).

值得注意的是，如果我手动放置两个或多个accordionPanel(没有JSF循环)，它们将起作用.

Noteworthy, if I put two or more accordionPanels by hand (without JSF loops) they works.

此外，当我尝试打开/关闭标签页时，我已经检查了浏览器发送的请求.我拦截的请求如下:

Also, I've checked the requests the browser sends when I try to open/close a tab. The requests I intercept are like:

<?xml version="1.0" encoding="utf-8"?><partial-response><changes><update id="mainForm:tabView"><![CDATA[
// something that always use the id of the HTML tag of the _last_ accordionPanel
</update></changes></partial-response>

如何将<accordionPanel>放在<ui:repeat>或<c:forEach>内，以便仍可以切换accordionPanel的选项卡?

How can I put an <accordionPanel> inside an <ui:repeat> or <c:forEach> so that I can still switch the accordionPanel's tab?

推荐答案

将p:accordion放在ui:repeat中时，widgetVar会出现问题，它将生成具有不同/动态ID的Accordion Panel组件，但不会生成当您像在代码中一样显式指定widgetVar时，则使用动态/不同的widgetVar.

Its the problem with the widgetVar when you put p:accordion in ui:repeat, it will generate Accordion Panel components with different/dynamic Ids but not with different/dynamic widgetVar when you explicitly specify widgetVar like you're doing in your code.

基本上是Javascript Object的名称，用于访问p:accordion的客户端Api功能.

Which is basically name to Javascript Object to access the Client side Api functions of p:accordion.

因此，如果您没有在任何地方使用widgetVar中的widgetVar属性，请使用删除 widgetVar属性，则将动态生成widgetVar.

So If you are not using that widgetVar of p:accordions anywhere, Remove widgetVar attribute, then the widgetVar will be generated dynamically.

如果您仍然想使用widgetVar，请自己给动态名称命名，例如:

If you still want to use widgetVar, give dynamic name yourself, for example:

widgetVar="accordion_#{o.data_one}" 

注意:我仅在ui:repeat上尝试了上述策略.
using:Primefaces 3.5和JSF 2.1.13及其对我有用.

Note: I tried the above strategy with only on ui:repeat.
Using:Primefaces 3.5 and JSF 2.1.13 and its working for me.

这篇关于ui:repeat或c:forEach中的PrimeFaces p:accordionPanel的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！