1

我正在尝试创建一个嵌套在 Primefaces Accordion 控件中的 JSF 复合控件。但是，当将选项卡组件放置在嵌套组件中时，它们根本不会渲染。

外部组件.xhtml

<composite:interface/>
<composite:implementation>
    <p:accordionPanel>
        <composite:insertChildren/>
    </p:accordionPanel>
</composite:implementation>

内部组件.xhtml

<composite:interface>
    <composite:attribute name="title" type="java.lang.String"/>
</composite:interface>
<composite:implementation>
    <p:tab id="#{cc.attrs.title}" title="#{cc.attrs.title}">
        Some content
    </p:tab>
</composite:implementation>

测试页.xhtml

<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:h="http://java.sun.com/jsf/html"
      xmlns:w="http://java.sun.com/jsf/composite/wizard"
     xmlns:p="http://primefaces.org/ui">

   <h:head>

   </h:head>
   <h:body>

      <w:outerComponent>
         <w:innerComponent title="tab1"/>
      </w:outerComponent>

   </h:body>
</html>

HTML 输出：

<html xmlns="http://www.w3.org/1999/xhtml"><head><link type="text/css" 
rel="stylesheet" href="/iip/javax.faces.resource/theme.css.xhtml?ln=primefaces-
aristo-custom" /><link type="text/css" rel="stylesheet" href="/iip/
javax.faces.resource/primefaces.css.xhtml?ln=primefaces" /><script type="text/
javascript" src="/iip/javax.faces.resource/jquery/jquery.js.xhtml?
ln=primefaces"></script><script type="text/javascript" src="/iip/
javax.faces.resource/primefaces.js.xhtml?ln=primefaces"></script></head>

<body>

<div id="j_idt7:j_idt10" class="ui-accordion ui-widget ui-helper-reset ui-hidden-
container" role="tablist"><input type="hidden" id="j_idt7:j_idt10_active" 
name="j_idt7:j_idt10_active" value="0" /></div>

<script id="j_idt7:j_idt10_s" type="text/
javascript">PrimeFaces.cw('AccordionPanel','widget_j_idt7_j_idt10',
{id:'j_idt7:j_idt10'});</script>

</body</html>

当它运行时没有错误，并且在呈现 Accordion div 时，选项卡没有。但是，如果我将<p:tab>标签移动到outerComponent.xhtml文件中，那么它们会正确呈现，但这不是我所需要的。

有什么建议么？

4

2 回答 2

3

<p:dataTable>像, <p:tabView>,等这样的迭代组件<p:accordionPanel>不能将组合作为直接子代。他们应该有完全有价值的<p:column>或<p:tab>组件作为直接的孩子。在视图渲染期间进行迭代时，它们会遍历子节点并在渲染之前对它们进行instanceof UIColumn或instanceof Tab检查。如果它失败（复合是NamingContainer），那么它将被完全忽略。这是“设计使然”。

您最好的选择是使用标记文件而不是复合组件作为迭代组件的子组件。

请注意，这不是 PrimeFaces 特有的。标准<h:dataTable>有完全相同的问题。

也可以看看：

于 2012-12-14T11:41:17.930 回答
0

您是否尝试在没有复合的情况下执行此操作 - 我的意思是将它们全部放在 testPage.xhtml 中。我没有尝试过这种特定的组合，但我在标签和手风琴与其他组件的组合方面遇到了问题。检查问题是否出在复合材料或组件组合中。

似乎有些 javascript 彼此“不兼容”。

如果您仍然有问题，您可以尝试封装选项卡。我尝试了不同的组合，似乎有些组合正在起作用，具体取决于导致问题的组件。我会先尝试使用选项卡，如果它不起作用<div id="tabContainer">，最终会转到。p:panel

于 2012-12-14T09:20:03.430 回答