JSFのdataTableで行を削除する方法

JSF dataTableの行を削除する方法

この例では、「delete」関数を追加してdataTableの行を削除することにより、前のJSF 2 dataTable exampleを拡張しています。

コンセプトを削除

全体的なコンセプトは非常にシンプルです：

1. 各行の最後に「削除」リンクを割り当てます。

//...




    Action

2. [削除]リンクをクリックした場合、現在の行オブジェクトをdeleteAction（）に渡します。 deleteAction（）メソッドでは、「リスト」から現在の行オブジェクトを削除して、現在のページに戻ります。

public String deleteAction(Order order) {

    orderList.remove(order);
    return null;
}

例

dataTableの行を削除する上記の概念を実装するJSF 2.0の例。

1. マネージドBean

「order」という名前のマネージドBean、一目瞭然。

package com.example;

import java.io.Serializable;
import java.math.BigDecimal;
import java.util.ArrayList;
import java.util.Arrays;

import javax.faces.bean.ManagedBean;
import javax.faces.bean.SessionScoped;

@ManagedBean(name="order")
@SessionScoped
public class OrderBean implements Serializable{

    private static final long serialVersionUID = 1L;

    private static final ArrayList orderList =
        new ArrayList(Arrays.asList(

        new Order("A0001", "Intel CPU",
                new BigDecimal("700.00"), 1),
        new Order("A0002", "Harddisk 10TB",
                new BigDecimal("500.00"), 2),
        new Order("A0003", "Dell Laptop",
                new BigDecimal("11600.00"), 8),
        new Order("A0004", "Samsung LCD",
                new BigDecimal("5200.00"), 3),
        new Order("A0005", "A4Tech Mouse",
                new BigDecimal("100.00"), 10)
    ));

    public ArrayList getOrderList() {

        return orderList;

    }

    public String deleteAction(Order order) {

        orderList.remove(order);
        return null;
    }

    public static class Order{

        String orderNo;
        String productName;
        BigDecimal price;
        int qty;

        public Order(String orderNo, String productName,
                BigDecimal price, int qty) {
            this.orderNo = orderNo;
            this.productName = productName;
            this.price = price;
            this.qty = qty;
        }

        //getter and setter methods
    }
}

2. JSFページ

JSFページを使用してdataTableタグでデータを表示し、「削除」リンクを作成して行レコードを削除します。



    
        
    
    

        JSF 2 dataTable example
        
            

            

                Order No
                #{o.orderNo}

            

            

                Product Name
                #{o.productName}

            

            

                Price
                #{o.price}

            

            

                Quantity
                #{o.qty}

            

            

                Action

3. Demo

上から下に、削除される行レコードを示します。

jsf2-dataTable-Delete-Example-1

jsf2-dataTable-Delete-Example-2

ソースコードをダウンロード

ダウンロード–JSF-2-DataTable-Delete-Example.zip（10KB）

TOC