0

我有 ajax 功能来添加名称并以表格方式显示在同一页面上,其中一张图像(在文本左侧)和一个“X”图像(在右侧删除)。它应该从左到右添加,完成一行后,它应该从下一行开始。

所以我需要在 p:datagrid 或任何其他可用于相同功能的标记中显示字符串的数组列表。

我尝试使用 ui:repeat 和 p:panelgrid 的组合,但我无法获得 datagrid 功能。我没有使用 p:dataTable 因为它会在底部添加新元素而不是我需要的。

附言

<h:form>

        <h:selectOneMenu id="recepients" value="#{controller.selected}">
            <f:selectItem itemLabel="Select" itemValue=""></f:selectItem>
            <f:selectItem itemLabel="Info1" itemValue="Info1"></f:selectItem>
            <f:selectItem itemLabel="Info2" itemValue="Info2"></f:selectItem>
            <f:selectItem itemLabel="Info3" itemValue="Info3"></f:selectItem>
            <f:selectItem itemLabel="Info4" itemValue="Info4"></f:selectItem>
            <f:selectItem itemLabel="Info5" itemValue="Info5"></f:selectItem>


        </h:selectOneMenu>
        <p:commandButton value="Add" action="#{controller.submit}"
            update="nameslist" />

        <p:dataGrid id="nameslist" value="#{controller.tempNameList}"
            var="name" columns="3">
            <p:column>
                <p:outputLabel value="%" />
            </p:column>
            <p:column>
                <p:outputLabel value="#{name}" />
            </p:column>
            <p:column>
                <p:commandLink value="X" action="#{controller.delete(name)}"
                    update="nameslist">
                </p:commandLink>                


            </p:column>

        </p:dataGrid>
    </h:form>

结果应该是这样的...

% Abc X % Xyz X % dfd X

请将 % 视为图像,将 X 视为关闭符号

4

1 回答 1

2

<p:dataGrid><p:column>支持。此列布局仅适用于<p:dataTable>.

将所有这些替换<p:column>为单个分组组件,例如,<h:panelGroup>或者可能<p:panel>,完全如展示站点上所示。

<p:dataGrid id="nameslist" value="#{controller.tempNameList}" var="name" columns="3">
    <h:panelGroup>
        <p:outputLabel value="%" />
        <p:outputLabel value="#{name}" />
        <p:commandLink value="X" action="#{controller.delete(name)}" update="nameslist" />
    </h:panelGroup>
</p:dataGrid>
于 2013-02-18T10:41:05.697 回答