(JSF 2.0) primefaces dataTable 组件的问题。答案

【问题标题】：(JSF 2.0) Problems with primefaces dataTable component.(JSF 2.0) primefaces dataTable 组件的问题。
【发布时间】：2011-07-24 08:47:35
【问题描述】：

我想用分页功能制作一个简单的数据表，但我有两个问题：

1-显示数据但浏览器中不显示分页器（我试过IE和chrome）

<p:dataTable var="garbage" value="#{resultsController.allGarbage}" paginator="true" rows="10">          

        <p:column>  
        <f:facet name="header">  
        <h:outputText value="Filename" />  
        </f:facet>  
        <h:outputText value="#{garbage.filename}" />
         </p:column> 

        <p:column>  
        <f:facet name="header">  
        <h:outputText value="Description" />  
        </f:facet>  
        <h:outputText value="#{garbage.description}" />  
         </p:column> 

        <p:column>  
        <f:facet name="header">  
        <h:outputText value="Upload date" />  
        </f:facet>  
        <h:outputText value="#{garbage.uploadDate}" /> 
         </p:column>                
</p:dataTable>

2- 在谷歌浏览器分页器中仍然没有显示，而且我每次刷新时都会看到一些额外的对话框：

这是否意味着 primefaces 与 chrome 不兼容？

------------更新 1--------- ---------

这是保留页面的外观：

<ui:composition template="WEB-INF/templates/BasicTemplate.xhtml">
<ui:define name="resultsForm">
<h:form enctype="multipart/form-data">
    <h:inputText id="search" value="" /><h:commandButton value="search"/>
    <h:selectOneRadio id="searchFilter" value="" >
            <f:selectItem id="r1" itemLabel="text documents(.pdf, .docx ...)" />
            <f:selectItem id="r2" itemLabel="audio(.mp3,.wav...)" />
            <f:selectItem id="r3" itemLabel="multimedia(.mpeg,flv...)" />
            <f:selectItem id="r4" itemLabel="other..." />               
    </h:selectOneRadio> 

    <p:dataTable var="garbage" value="#{resultsController.allGarbage}" paginator="true" rows="10"  
             paginatorTemplate="{CurrentPageReport}  {FirstPageLink} {PreviousPageLink} {PageLinks} {NextPageLink} {LastPageLink} {RowsPerPageDropdown}"  
             rowsPerPageTemplate="5,10,15">         

            <p:column>  
            <f:facet name="header">  
            <h:outputText value="Filename" />  
            </f:facet>  
            <h:outputText value="#{garbage.filename}" />
             </p:column> 

            <p:column>  
            <f:facet name="header">  
            <h:outputText value="Description" />  
            </f:facet>  
            <h:outputText value="#{garbage.description}" />  
             </p:column> 

            <p:column>  
            <f:facet name="header">  
            <h:outputText value="Upload date" />  
            </f:facet>  
            <h:outputText value="#{garbage.uploadDate}" /> 
             </p:column>                
    </p:dataTable> 
</h:form>
</ui:define>

------------更新 2--------- ---------

此图是组件在 chrome 中的显示方式以及 chrome 控制台如何显示错误：

【问题讨论】：

你用过 Opera 还是 FF？
是的，它在任何情况下都不起作用。我只是不明白为什么不显示分页？我完全按照primefaces.org/showcase/ui/datatablePagination.jsf 中所说的那样做
您的表格是否嵌套在任何其他 primefaces 或 jsf 组件中？如果是，您可以在这些周围的组件之外尝试它。
是表单内的dataTable。试着把它放在h:form
是的，它在一个表单中，现在我将更新它的样子。

标签： java jsf browser jakarta-ee jsf-2

【解决方案1】：

如果您在生成的 HTML <head> 中没有看到任何 PrimeFaces 特定的 CSS/JS 导入（在浏览器中右键单击页面，选择 查看源代码，则意味着您需要替换 HTML @ JSF <h:head> 在您的模板中添加 987654322@。这就是所有资源依赖项（连接到 JSF 组件/库的 CSS/JS/图像/等）的最终位置。

在以前的 PrimeFaces 版本中（至少在 2.0 中），您还需要配置一个资源 servlet，以便 PrimeFaces 可以从 JAR 文件中提供它们：

<servlet>
    <servlet-name>Resource Servlet</servlet-name>
    <servlet-class>org.primefaces.resource.ResourceServlet</servlet-class>
</servlet>
<servlet-mapping>
    <servlet-name>Resource Servlet</servlet-name>
    <url-pattern>/primefaces_resource/*</url-pattern>
</servlet-mapping>

但我不确定 PrimeFaces 2.0 之后的更新版本，目前用户手册由于某种原因不再免费。

【讨论】：

现在可以了，谢谢。但我仍然不明白为什么每次我想使用素面时我都必须添加那些脚本标签。我可以避免以某种方式这样做吗？再次感谢。
为什么要避免这种情况？它只是 PrimeFaces 核心功能和外观的一部分，因此您无需自己编写。
好的，我想我现在明白了。我只是认为我可以使用所有的 prime-faces 组件，而无需提及他们需要什么脚本文件。
您根本不需要提及它们。如果您使用 <h:head>，它们应该会自动出现在 head 中。你明白我的回答了吗？
没有。我没有在任何地方这么说。看起来您将我的答案与马特汉迪的答案混为一谈。我所说的只是将<head> 替换为<h:head>，如有必要还配置ResourceServlet。就是这样。

【解决方案2】：

从 JS 错误看来，PrimeFaces javascript 库似乎没有正确包含。

我对 mojarra 有同样的问题（在 js 控制台中“未定义 mojarra”）。似乎由于某种原因不包括 js 库（应该由服务器完成）。有时是，有时不是（从未找到原因）。

如果有人阅读本文有任何想法，我将不胜感激。

对于 mojarre，我的解决方法是手动包含 mojarra 的 js 库。

关于你的问题，试试 Primefaces。

在我的项目中有一个使用 p:dataTable 和分页的页面。包括以下 js 文件（以及其他一些文件；显示在 html 输出的源代码中）：

<script type="text/javascript" src="/register/primefaces_resource/2.1/yui/datasource/datasource-min.js"></script> 
<script type="text/javascript" src="/register/primefaces_resource/2.1/primefaces/paginator/paginator.js"></script> 
<script type="text/javascript" src="/register/primefaces_resource/2.1/yui/datatable/datatable-min.js"></script> 
<script type="text/javascript" src="/register/primefaces_resource/2.1/primefaces/datatable/datatable.js"></script> 
<script type="text/javascript" src="/register/primefaces_resource/2.1/yui/swf/swf-min.js"></script> 
<script type="text/javascript" src="/register/primefaces_resource/2.1/yui/charts/charts-min.js"></script> 
<script type="text/javascript" src="/register/primefaces_resource/2.1/primefaces/charts/charts.js"></script>

查看您的 html 输出并检查是否包含与分页相关的 js 文件。如果没有，请手动包含它们。请注意，src 属性中的/register 是我的上下文路径。将其替换为您的上下文路径。

【讨论】：

我刚刚在输出中看到了视图源，那些脚本不存在。我应该从某个地方下载它们并将它们添加到我的 WEB-INF/lib 文件夹中吗？我应该如何手动包含它们？我从来没有在 Eclipse 中这样做过。
不，它们在 primefaces.jar 中（是否在您的类路径中，例如项目的 lib 文件夹？）。如果您（成功）在其他页面上使用 primefaces 组件，则可以将包含目录复制到那里。
是的，primefaces-2.2.1.jar 在我的 lib 文件夹中，但我不明白应该在我的 results.xhtml 页面中添加什么。我应该将这些脚本标签添加到页面的头部标签中吗？
示例：如果您的上下文路径是 /project，请尝试将以下内容添加到 results.xhtml 的标题中：<script type="text/javascript" src="/project/primefaces_resource/2.2.1/primefaces/paginator/paginator.js"></script>
我添加了这个：但它不起作用。我怎么知道那条路径是否正确？如何检查我的路径？