p:datatable分页不起作用

时间:2015-08-10 14:14:17

标签: jsf-2 primefaces datatable pagination

我尝试使用分页呈现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;
}

它仍然不起作用

4 个答案:

答案 0 :(得分:1)

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

试试

<div>
  <h2><span><a href="#/" ng-click="loadParent()">Go Back</a></span> Event Log</h2>
</div>

之前

@SessionScope

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

更新: 尝试在ui:composition

中添加标签
@Named

我认为css没有加载

更新2:

以下是来自primefaces展示的工作分页代码。与您的代码进行比较并进行测试。

<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">

答案 1 :(得分:1)

我遇到了这个问题。但问题是我有两个datalist具有相同的widgetVar名称。也许对某人有帮助。

答案 2 :(得分:0)

通过添加'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(...)

你看到的所有“例子”都没有用,这很奇怪,因为PrimeFaces的展示效果非常好。

另见:

答案 3 :(得分:0)

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

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

我希望这会在某些时候帮助任何人。我显然不会再犯这个错误了。

非常感谢您的所有时间并帮助您度过这一切!