JSF中有一個叫作DataTable的控件，可用來渲染和格式化html表格。使用DataTable，我們可以迭代收集或數(shù)組數(shù)組來顯示數(shù)據(jù)。下面我們來學(xué)習(xí)如何向DataTable排序數(shù)據(jù)。

要使用DataTable，我們需要添加以下HTML頭。

xmlns="http://www.w3.org/1999/xhtml"

xmlns:h="http://java.sun.com/jsf/html">

以下JSF標(biāo)簽 -

styleClass="employeeTable"

headerClass="employeeTableHeader"

rowClasses="employeeTableOddRow,employeeTableEvenRow">

Name

#{employee.name}

Department

#{employee.department}

Age

#{employee.age}

Salary

#{employee.salary}

被渲染成以下HTML標(biāo)簽。

NameDepartmentAgeSalary

TomMarketing102000.0RobertMarketing151000.0

JSF數(shù)據(jù)表更新行數(shù)據(jù)實例

打開 NetBeans IDE 創(chuàng)建一個Web工程：DataTableSort，其目錄結(jié)構(gòu)如下所示 -

創(chuàng)建以下文件代碼，文件：index.xhtml 的代碼內(nèi)容如下所示 -

/p>

"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

xmlns:h="http://java.sun.com/jsf/html"

xmlns:f="http://java.sun.com/jsf/core"

xmlns:c="http://java.sun.com/jsp/jstl/core"

>

JSF 2 dataTable sorting example

styleClass="book-table"

headerClass="book-table-header"

rowClasses="book-table-odd-row,book-table-even-row"

>

Book No

#{o.bookNo}

Product Name

#{o.productName}

Price

#{o.price}

Quantity

#{o.qty}

文件：User.java 的代碼內(nèi)容如下所示 -

/*

* To change this license header, choose License Headers in Project Properties.

* To change this template file, choose Tools | Templates

* and open the template in the editor.

*/

package com.yiibai;

/**

*

* @author Maxsu

*/

import java.io.Serializable;

import java.math.BigDecimal;

import java.util.ArrayList;

import java.util.Arrays;

import java.util.Collections;

import java.util.Comparator;

import java.util.List;

import javax.faces.bean.ManagedBean;

import javax.faces.bean.SessionScoped;

@ManagedBean(name = "book")

@SessionScoped

public class User implements Serializable {

private static final long serialVersionUID = 1L;

private List bookArrayList;

private boolean sortAscending = true;

private static final Book[] bookList = {

new Book("1234", "Java", new BigDecimal("2303.0"), 3),

new Book("3211", "Web", new BigDecimal("4232.00"), 6),

new Book("2344", "SQL", new BigDecimal("5230.00"), 10),

new Book("5643", "CSS", new BigDecimal("11320.00"), 9),

new Book("4565", "HTML", new BigDecimal("232.00"), 20)

};

public User() {

bookArrayList = new ArrayList(Arrays.asList(bookList));

}

public List getBookList() {

return bookArrayList;

}

//sort by book no

public String sortByBookNo() {

if (sortAscending) {

//ascending book

Collections.sort(bookArrayList, new Comparator() {

@Override

public int compare(Book o1, Book o2) {

return o1.getBookNo().compareTo(o2.getBookNo());

}

});

sortAscending = false;

} else {

//descending book

Collections.sort(bookArrayList, new Comparator() {

@Override

public int compare(Book o1, Book o2) {

return o2.getBookNo().compareTo(o1.getBookNo());

}

});

sortAscending = true;

}

return null;

}

public static class Book {

String bookNo;

String productName;

BigDecimal price;

int qty;

public Book(String bookNo, String productName,

BigDecimal price, int qty) {

this.bookNo = bookNo;

this.productName = productName;

this.price = price;

this.qty = qty;

}

public String getBookNo() {

return bookNo;

}

public void setBookNo(String bookNo) {

this.bookNo = bookNo;

}

public String getProductName() {

return productName;

}

public void setProductName(String productName) {

this.productName = productName;

}

public BigDecimal getPrice() {

return price;

}

public void setPrice(BigDecimal price) {

this.price = price;

}

public int getQty() {

return qty;

}

public void setQty(int qty) {

this.qty = qty;

}

}

}

文件：table-style.css 的代碼內(nèi)容如下所示 -

.book-table-header{

bbook-bottom:1px solid #BBB;

padding:16px;

}

.book-table-odd-row{

bbook-top:1px solid #BBB;

}

.book-table-even-row{

bbook-top:1px solid #BBB;

}

右鍵運行工程：DataTableSort，如果沒有任何錯誤，打開瀏覽器訪問：

http://localhost:8084/DataTableSort/

應(yīng)該會看到以下結(jié)果 -

在上圖中，您可以點擊”Book No“，就可以看到排序情況了。

￥ 我要打賞

糾錯/補充

收藏

加QQ群啦，易百教程官方技術(shù)學(xué)習(xí)群

注意：建議每個人選自己的技術(shù)方向加群，同一個QQ最多限加 3 個群。

總結(jié)

以上是生活随笔為你收集整理的java jsf table_JSF数据表(h:dataTable)排序数据的全部內(nèi)容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網(wǎng)站內(nèi)容還不錯，歡迎將生活随笔推薦給好友。