p:datatable 分页不起作用

Question

我正在尝试使用分页呈现 DataTable，但到目前为止我发现没有任何代码片段真正有效。我想我错过了一些东西......

这是我的测试站点，代码非常精简，但仍然无法运行：

test.xhtml

<html xmlns="http://www.w3.org/1999/xhtml"
xmlns:ui="http://java.sun.com/jsf/facelets"
xmlns:h="http://java.sun.com/jsf/html"
xmlns:f="http://java.sun.com/jsf/core"
xmlns:p="http://primefaces.org/ui">

<body>
<ui:composition>

    <h:form>
        <p:dataTable id="dataTable" var="car" value="#{testBean.createCars(50)}"
            paginator="true" rows="10"
            paginatorTemplate="{CurrentPageReport}  {FirstPageLink} {PreviousPageLink} {PageLinks} {NextPageLink} {LastPageLink} {RowsPerPageDropdown}"
            rowsPerPageTemplate="5,10,15">
            <f:facet name="header">
            Ajax Pagination
        </f:facet>

            <p:column>
                <f:facet name="header">
                    <h:outputText value="Brand" />
                </f:facet>
                <h:outputText value="#{car.brand}" />
            </p:column>

            <p:column>
                <f:facet name="header">
                    <h:outputText value="Year" />
                </f:facet>
                <h:outputText value="#{car.year}" />
            </p:column>

            <p:column>
                <f:facet name="header">
                    <h:outputText value="Color" />
                </f:facet>
                <h:outputText value="#{car.color}" />
            </p:column>
        </p:dataTable>
    </h:form>

</ui:composition>
</body>
</html>

testBean.java（代码取自http://www.primefaces.org/showcase/ui/data/datatable/paginator.xhtml）

@Named 
public class TestBean implements Serializable {

/** serialVersionUID. */
private static final long serialVersionUID = 1L;

private final static String[] colors;

private final static String[] brands;

static {
    colors = new String[10];
    colors[0] = "Black";
    colors[1] = "White";
    colors[2] = "Green";
    colors[3] = "Red";
    colors[4] = "Blue";
    colors[5] = "Orange";
    colors[6] = "Silver";
    colors[7] = "Yellow";
    colors[8] = "Brown";
    colors[9] = "Maroon";

    brands = new String[10];
    brands[0] = "BMW";
    brands[1] = "Mercedes";
    brands[2] = "Volvo";
    brands[3] = "Audi";
    brands[4] = "Renault";
    brands[5] = "Fiat";
    brands[6] = "Volkswagen";
    brands[7] = "Honda";
    brands[8] = "Jaguar";
    brands[9] = "Ford";
}

public List<Car> createCars(int size) {
    List<Car> list = new ArrayList<Car>();
    for (int i = 0; i < size; i++) {
        list.add(new Car(getRandomId(), getRandomBrand(), getRandomYear(), getRandomColor(), getRandomPrice(), getRandomSoldState()));
    }

    return list;
}

private String getRandomId() {
    return UUID.randomUUID().toString().substring(0, 8);
}

private int getRandomYear() {
    return (int) (Math.random() * 50 + 1960);
}

private String getRandomColor() {
    return colors[(int) (Math.random() * 10)];
}

private String getRandomBrand() {
    return brands[(int) (Math.random() * 10)];
}

public int getRandomPrice() {
    return (int) (Math.random() * 100000);
}

public boolean getRandomSoldState() {
    return (Math.random() > 0.5) ? true : false;
}

public List<String> getColors() {
    return Arrays.asList(colors);
}

public List<String> getBrands() {
    return Arrays.asList(brands);
}

}

我的输出总是：

http://i.stack.imgur.com/MXy7Y.png

有人可以帮我吗？

更新 1 即使我使用以下代码

<p:dataTable id="dataTable" var="car" value="#{testBean.cars}"

和

@PostConstruct
public void createCars() {
    int size = 50;
    if (cars == null) {
        cars = new ArrayList<Car>();
        for (int i = 0; i < size; i++) {
            cars.add(new Car(getRandomId(), getRandomBrand(), getRandomYear(), getRandomColor(), getRandomPrice(), getRandomSoldState()));
        }
    }
}

public List<Car> getCars() {
    return cars;
}

还是不行

Answer 1

通过添加为 'Sytem.out.println' 检查您的 'createCars(50)' 被调用的频率。很可能比您预期的要多。再看看与PrimeFaces Showcase的区别

您指向的代码执行此操作：

@PostConstruct
public void init() {
    cars = service.createCars(50);
}

public List<Car> getCars() {
    return cars;
}

和

<p:dataTable var="car" value="#{dtPaginatorView.cars}"...

而你直接调用createCars(...)。

奇怪的是，您看到的所有 'examples' 都不起作用，因为 PrimeFaces 展示完美无缺。

另请参阅：

Why JSF calls getters multiple times

Answer 2

也许只是您没有粘贴所有代码，但我缺少范围。

试试把

@SessionScope

就在

之前

@Named

并保留 Kukeltje 给你的代码。这绝对是朝着正确的方向迈出了一步

更新：尝试在 ui:composition

中添加标签

<html> 
 <body> 
   <ui:composition
   xmlns="http://www.w3.org/1999/xhtml"
   xmlns:ui="http://java.sun.com/jsf/facelets"
   xmlns:h="http://java.sun.com/jsf/html"
   xmlns:f="http://java.sun.com/jsf/core"
   xmlns:p="http://primefaces.org/ui">

我认为css没有加载

更新 2：

这是来自 primefaces showcase 的工作分页代码。与您的代码进行比较并进行测试。

 <?xml version="1.0" encoding="UTF-8"?> 
<html xmlns="http://www.w3.org/1999/xhtml"  xmlns:h="http://java.sun.com/jsf/html"  xmlns:f="http://java.sun.com/jsf/core"      xmlns:ui="http://java.sun.com/jsf/facelets"     xmlns:p="http://primefaces.org/ui">     
<h:head>    
</h:head>   
<h:body>        
<h:form prependId="false">          
<p:dataTable id="dataTable" var="car" value="#{tableBean.cars}" paginator="true" rows="10" paginatorTemplate="CurrentPageReport} {FirstPageLink} {PreviousPageLink} {PageLinks} {NextPageLink} {LastPageLink} {RowsPerPageDropdown}"rowsPerPageTemplate="5,10,15">
            <f:facet name="header">
                Ajax Pagination
            </f:facet>
         <p:column>
            <f:facet name="header">
                <h:outputText value="Brand" />
            </f:facet>
            <h:outputText value="#{car.brand}" />
        </p:column>

        <p:column>
            <f:facet name="header">
                <h:outputText value="Year" />
            </f:facet>
            <h:outputText value="#{car.year}" />
        </p:column>

        <p:column>
            <f:facet name="header">
                <h:outputText value="Color" />
            </f:facet>
            <h:outputText value="#{car.color}" />
        </p:column>  </p:dataTable>

    </h:form>   
</h:body>
 </html>

Answer 3

这个问题显然不是我们所想的...只是 <ui:composition> ... </ui:composition>

的错误用法

在我删除标签后，它已修复。这里的问题是 <ui:composition> 忽略了它周围的所有内容（甚至像 <body> 的 <head> 这样的标签）。这意味着 xhtml 文件没有被解析为正确的 html 页面。如果没有任何 <head> 标签，javascript 将无法包含，因此该功能被禁用并且分页无法正常工作。

我希望这在某些时候能帮助到任何人。我以后绝对不会再犯这样的错误了。

无论如何，感谢您抽出宝贵的时间帮助您解决这个问题！

Answer 4

我遇到过这个问题。但问题是我有两个数据列表具有相同的 widgetVar 名称。也许对某人有帮助。

p:datatable 分页不起作用

p:datatable pagination does not work

datatable

pagination

primefaces

jsf-2