单列中多个单元格的事件

时间:2014-06-09 09:05:16

标签: gwt gwt2 gwt-celltable

我在一列中有两个按钮(编辑+删除)。

    ButtonCell functionButtonCell = new ButtonCell() {
    @Override
    public void render(final Context context, final SafeHtml data, final SafeHtmlBuilder sb) {
        sb.appendHtmlConstant("<button type='button' class='gwt-Button' style = 'width:60px;margin:1px;'>Edit</button>");
        sb.appendHtmlConstant("<br/>");
        sb.appendHtmlConstant("<button type='button' class='gwt-Button' style = 'width:60px;margin:1px;'>Delete</button>");
        }
    };
    functionColumn = new Column<AdminModel, String>(functionButtonCell) {
        public String getValue(final AdminModel object) {
            return object.getSeq().toString();
        }
    };

将Presenter中此列的事件绑定为

.........
view.getFunctionColumn().setFieldUpdater(new FieldUpdater<AdminModel, String>() {

   public void update(final int index, final AdminModel object, final String value) {
            Window.alert(index + "-" + value);
        }
    });

点击编辑按钮后,出现了警告框,但删除按钮上没有。当我点击删除按钮时,没有出现任何内容。会出现什么问题?

  

添加: 如何判断用户点击了哪个按钮(编辑或删除)?

我非常感谢你的任何建议,因为我很长一段时间都很困扰。谢谢!

2 个答案:

答案 0 :(得分:1)

理想情况下,列只应包含一种类型的单元ImageCellButtonCell等。因为所有这些ImageCellButtonCell都不提供任何内置事件。事件由FieldUpdater本身处理,没有区别对象来识别单击ButtonCell的事件。理想情况下,单击该列时,将调用字段更新程序。

您应该创建自己的扩展HasCell的复合小部件。此复合窗口小部件将具有两个不同的按钮,并且在单击相应按钮时会调用构建方法中的按钮。

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-Need to have two buttons in last single cell of each row

答案 1 :(得分:1)

ButtonCell仅过滤第一个子元素上的事件:https://gwt.googlesource.com/gwt/+/2.6.1/user/src/com/google/gwt/cell/client/ButtonCell.java这就是您在点击第二个按钮时没有获得事件的原因(注意:该代码的目标是制作确定你点击了按钮,而不是点击按钮周围的空白区域;请参阅https://gwt.googlesource.com/gwt/+/a0dc88c8be7408be9554f746eb1ec93798183a28

实现双按钮单元格的最简单方法是使用CompositeCell;它要求将子单元格渲染为兄弟元素(默认情况下使用<span>,下面的示例会覆盖渲染以使用<div>,因此您的按钮会在各自的行上堆叠)。

new CompositeCell<AdminModel>(Arrays.asList(
  // First button
  new HasCell<AdminModel, String>() {
    @Override public Cell<String> getCell() { return new ButtonCell(); }
    @Override public FieldUpdated<AdminModel, String> getFieldUpdater() {
      return new FieldUpdater<AdminModel, String>() {
        @Override public void update(int index, AdminModel object, String value) {
          Window.alert("Edit " + object.getId());
        }
      };
    }
    @Override public String getValue(AdminModel o) {
      return "Edit";
    }
  },
  // Second button
  new HasCell<AdminModel, String>() {
    @Override public Cell<String> getCell() { return new ButtonCell(); }
    @Override public FieldUpdated<AdminModel, String> getFieldUpdater() {
      return new FieldUpdater<AdminModel, String>() {
        @Override public void update(int index, AdminModel object, String value) {
          Window.alert("Delete " + object.getId());
        }
      };
    }
    @Override public String getValue(AdminModel o) {
      return "Delete";
    }
  }) {
  @Override protected <X> void render(Cell.Context context, AdminModel value, SafeHtmlBuilder sb, HasCell<String,X> hasCell) {
    // use a <div> instead of the default <span>
    Cell<X> cell = hasCell.getCell();
    sb.appendHtmlConstant("<div>");
    cell.render(context, hasCell.getValue(value), sb);
    sb.appendHtmlConstant("</div>");
  }
};

(注意:在你的情况下,因为按钮的文字并不依赖于行对象,所以你应该使用ActionCell;它更适合&#34;语义和&#34; #34;您正在做的事情,但除此之外它几乎相同;使用ActionCell,您使用HasCell<AdminModel, AdminModel>ActionCell<AdminModel>,{ {1}}将按原样返回getFieldUpdater getValue null, and the HasCell of the AdminModel`参数。

否则,请完全自己实施would just return the(或Cell)。