primeFaces中 <p:dataList>简单使用

最新推荐文章于 2020-07-11 05:18:29 发布

原创最新推荐文章于 2020-07-11 05:18:29 发布 · 1.6k 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#primefaces #web开发 #xhtml #控件 #界面

Primefaces相关专栏收录该内容

4 篇文章

订阅专栏

本文介绍了PrimeFaces的<p:dataList>组件的使用，包括展示简单数据和创建可编辑数据单元格的功能。通过XHTML代码示例展示了如何绑定数据源并展示多个字段，以及如何创建包含编辑功能的列表，如日期选择器和输入文本框。此外，提到了管理Bean和数据列表的数据来源。

1. <p:dataList>的功能:

以列表布局方式显示一组数据，可以是多种数据类型,此处仅介绍两种我自己实验过的类型。

2.<p:dataList>属性:

3.实现的功能:

(1)以简单数据记录的形式显示简单的数据

具体实现:

XHTML代码:

                <p:dataList value="#{outNoticeMng.editOutNoticeList}" var="outNoticeDataJSF" >
                                   #{outNoticeDataJSF.ponInputdate},
                                        #{outNoticeDataJSF.ponOutdate},
                                        #{outNoticeDataJSF.prdInvoiceno},
                                        #{outNoticeDataJSF.prdQty},
                                        #{outNoticeDataJSF.prdBoxqty},
                                        #{outNoticeDataJSF.prdDestination},
                                        #{outNoticeDataJSF.prdCarriagemode}
                 </p:dataList>

(2)以可编辑的数据单元显示数据.

具体实现:

XHTML代码:

                     <p:dataList value="#{outNoticeMng.editOutNoticeList}" var="outNoticeDataJSF" >
                                    <h:panelGrid   columns="4" >
                                        <p:outputLabel value="做成日:"/>
                                        <p:calendar     readonlyInput="true"   value="#{outNoticeDataJSF.ponInputdate}" pattern="yyyy-MM-dd" />
                                        <p:outputLabel value="出库预订日:"/>
                                        <p:calendar    readonlyInput="true" value="#{outNoticeDataJSF.ponOutdate}" pattern="yyyy-MM-dd" />
                                        <p:outputLabel value="发票号:"></p:outputLabel>
                                        <p:inputText value="#{outNoticeDataJSF.prdInvoiceno}"/>
                                        <p:outputLabel value="数量:"></p:outputLabel>
                                        <p:inputText value="#{outNoticeDataJSF.prdQty}"/>
                                        <p:outputLabel value="箱数:"></p:outputLabel>
                                        <p:inputText value="#{outNoticeDataJSF.prdBoxqty}"/>
                                        <p:outputLabel value="目的地:"></p:outputLabel>
                                        <p:inputText value="#{outNoticeDataJSF.prdDestination}"/>
                                        <p:outputLabel value="运输方式:"></p:outputLabel>
                                        <p:inputText value="#{outNoticeDataJSF.prdCarriagemode}"/>
                                         <p:commandButton value="提交" actionListener="#{outNoticeMng.submit()}"/>
                                    </h:panelGrid>
                                </p:dataList>