GWT CellTable-需要在每行的最后一个单元格中有两个按钮 [英] GWT CellTable-Need to have two buttons in last single cell of each row

问题描述

我正在使用 CellTable 向其中添加列.当我在每个单元格上添加行和单个数据时，它工作正常.

I am using CellTable to add columns to it. It works fine when I add rows and single data on each cell.

它有像 Name ,Age, Address 这样的标题，下面的行包含值

It has header like Name ,Age, Address with rows below it which contains the values

我现在想要在最后一个 Actions cloumn，在此列下方的行的单个单元格中包含两个按钮(编辑和删除按钮)，并相应地捕获按钮单击事件.

I now want to have a Actions cloumn in the last with two buttons (Edit and Delete Button) in single cell in on the rows below this column and to capture the button click events acordingly.

Name Age Address   Actions
A    15    123    Edit Delete
B    20    578    Edit Delete    
C

你能告诉我怎么做吗.

谢谢

推荐答案

有两种方法可以实现:

1. 子类 AbstractCell 和实现渲染方法以创建两个按钮并处理其事件(请参阅此处 了解更多详情).
2. 使用 CompositeCell添加两个 ActionCells

1. Subclass AbstractCell and implement the render method to create two buttons and handle its events (see here for more details).
2. Use a CompositeCell to add two ActionCells

第二种方法更简单、更简洁.这是代码:

Second approach is easier and cleaner. Here is the code for that:

public void onModuleLoad() {
    CellTable<Person> table = new CellTable<Person>();

    List<HasCell<Person, ?>> cells = new LinkedList<HasCell<Person, ?>>();
    cells.add(new ActionHasCell("Edit", new Delegate<Person>() {

        @Override
        public void execute(Person object) {
           // EDIT CODE
        }
    }));
    cells.add(new ActionHasCell("Delete", new Delegate<Person>() {

        @Override
        public void execute(Person object) {
            // DELETE CODE
        }
    }));

    CompositeCell<Person> cell = new CompositeCell<Person>(cells);
    table.addColumn(new TextColumn<Person>() {

        @Override
        public String getValue(Person object) {
            return object.getName()
        }
    }, "Name");

    // ADD Cells for Age and Address

    table.addColumn(new Column<Person, Person>(cell) {

        @Override
        public Person getValue(Person object) {
            return object;
        }
    }, "Actions");


}

private class ActionHasCell implements HasCell<Person, Person> {
    private ActionCell<Person> cell;

    public ActionHasCell(String text, Delegate<Person> delegate) {
        cell = new ActionCell<Person>(text, delegate);
    }

    @Override
    public Cell<Person> getCell() {
        return cell;
    }

    @Override
    public FieldUpdater<Person, Person> getFieldUpdater() {
        return null;
    }

    @Override
    public Person getValue(Person object) {
        return object;
    }
}

这篇关于GWT CellTable-需要在每行的最后一个单元格中有两个按钮的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！