0

我面临一个小问题，无法从数据中显示我的数据。我正在使用 ui:repeat 标签，它是数据迭代器。在 ui:repeat 我使用嵌套的 h:panelGrid 标签来显示我的数据。例如

<ui:repeat data iterator>
<index wise data />
</ui:repeat>

我想要以下输出。

<index 1 data><index 2 data>
<index 3 data><index 4 data>
<index 5 data><index 6 data>

等等...

它生成以下输出。

<index 1 data>
<index 2 data>
<index 3 data>
<index 4 data>

这是我的代码。请看一看。

<h:form id="catalog-form">
        <p:poll interval="10" update="catalog-form" /> 
            <ui:repeat  var="product" value="#{productController.bean.products}">
                <h:panelGrid  columns="2"  style="border:1px solid black;">
                    <p:graphicImage width="80" height="80" value="#{productController.content}" styleClass="rounded-corners">
                        <f:param name="id" value="#{product.productId}" />
                    </p:graphicImage>
                    <h:panelGrid columns="2"  style="border:1px solid black;">
                        <p:outputLabel value="Product Name : " />
                        <p:outputLabel  value="#{product.productName}"  />
                        <h:panelGrid columns="3"  style="border:1px solid black;">
                            <p:commandButton styleClass="btns" id="addCommentBtn" icon="a-icon" onclick="productdlg.show()"  update=":selectedProduct,:comment-form:productIdOut,:show-color-form,:show-camera-form">
                                <f:actionListener binding="#{productController.setTempProduct(product)}"/>
                                <f:actionListener binding="#{productCommentController.bean.setProductId(product.productId)}"/>
                            </p:commandButton>
                            <p:commandButton styleClass="btns" id="commentDlg" icon="comments-icon" onclick="productcmtdlg.show()"  update=":commentProduct,:show-comment-form">
                                <f:actionListener binding="#{productController.setTempProduct(product)}"/>
                            </p:commandButton>
                            <p:commandButton styleClass="btns" id="featureDlg" icon="feature-icon" onclick="productfeaturedlg.show()"  update=":featureProduct,:show-feature-form">
                                <f:actionListener binding="#{productController.setTempProduct(product)}"/>
                            </p:commandButton>
                        </h:panelGrid>
                    </h:panelGrid>
                </h:panelGrid>
            </ui:repeat>
        </h:form>
4

2 回答 2

0

我认为您应该考虑更简单的 HTML/CSS。有时尝试使用过多的 JSF 标签会使一切变得复杂...您可以轻松地更改代码以使用浮动div，如下所示：

<h:form id="catalog-form" style="width: 500px;">
    <p:poll interval="10" update="catalog-form" /> 

    <ui:repeat  var="product" value="#{productController.bean.products}">
        <div style="width: 50%;float: left;border:1px solid black;">
            <p:graphicImage width="80" height="80" value="#{productController.content}" styleClass="rounded-corners">
                <f:param name="id" value="#{product.productId}" />
            </p:graphicImage>
            <h:panelGrid columns="2"  style="border:1px solid black;">
                <p:outputLabel value="Product Name : " />
                <p:outputLabel  value="#{product.productName}"  />
                <h:panelGrid columns="3"  style="border:1px solid black;">
                    <p:commandButton styleClass="btns" id="addCommentBtn" icon="a-icon" onclick="productdlg.show()"  update=":selectedProduct,:comment-form:productIdOut,:show-color-form,:show-camera-form">
                        <f:actionListener binding="#{productController.setTempProduct(product)}"/>
                        <f:actionListener binding="#{productCommentController.bean.setProductId(product.productId)}"/>
                    </p:commandButton>
                    <p:commandButton styleClass="btns" id="commentDlg" icon="comments-icon" onclick="productcmtdlg.show()"  update=":commentProduct,:show-comment-form">
                        <f:actionListener binding="#{productController.setTempProduct(product)}"/>
                    </p:commandButton>
                    <p:commandButton styleClass="btns" id="featureDlg" icon="feature-icon" onclick="productfeaturedlg.show()"  update=":featureProduct,:show-feature-form">
                        <f:actionListener binding="#{productController.setTempProduct(product)}"/>
                    </p:commandButton>
                </h:panelGrid>
            </h:panelGrid>
        </div>
    </ui:repeat>
    <div style="clear: both"></div>
</h:form>

请注意，我将s替换h:panelGrid为 simple div，divs 是总宽度的 50%（当前由之后的元素。h:formdivh:form

于 2013-05-28T21:19:41.830 回答
0

将 ui:repeat 替换为 p:dataGrid。在 p:dataGrid 中，可以使用 cloumn 属性。使用它，您可以显示您想要的内容。

   <ui:repeat  var="product" value="#{productController.bean.products}">

像这样改变上面的行，

  <p:dataGrid var="product" value="#{productController.bean.products}" columns="2">

参考： http: //www.primefaces.org/showcase/ui/dndGrid.jsf

于 2013-05-29T03:08:12.367 回答