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

问题描述

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

它具有名称，年龄，地址以及包含值

现在我想在最后一个动作窗口中有两个按钮（编辑和删除按钮）放在此列下面的行中的单个单元格中，并捕获按钮点击事件。

 姓名年龄地址操作
 A 15 123编辑删除
 B 20 578编辑删除
 C 
  

请让我知道如何去做。

感谢

解决方案

有两种方法可以实现这一点：

1. 子类 AbstractCell 并实现render方法来创建两个按钮并处理其事件（请参见在这里了解更多详情）。


2. 使用 CompositeCell 添加两个行动细胞 s

第二种方法更简单，更清洁。以下是该代码：

  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）{
 / /编辑代码
} 
}））; 
 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）; 
 
 //为年龄和地址添加单元格
 
 table.addColumn（新列< Person，Person>（单元格）{
 
 @Override 
 public Person getValue（Person object）{
 return object; 
} 
}，Actions）; 
 
 
} 
 
 private class ActionHasCell实现了HasCell< Person，Person> {
 private ActionCell< Person>细胞; 
 
 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; 
} 
} 
  

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

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

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

Could you please let me know how to do it.

Thanks

解决方案

There are two ways to achieve that:

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屋！