Question

我有一个单元格表，其中3列一个用于名称，一个用于类型，一个用于图像。

我有另一个列表框，用于指定单元格表的类型列中存在的类型。

在单元格表格中，对于多行可能相同。当我在列表框中选择一个类型时，单元格表格中不具有相同类型的所有行都应在图像单元格中添加一个图标。

到目前为止，我可以根据在该单元格中输入的值来搜索动态添加样式名称。但现在我的目的是根据另一个小部件的值来获得动态样式名称。

请给我一个答案。以下是提供的代码

public class CellTableExample implements EntryPoint, ChangeHandler {

  CellTable<NameType> ct = new CellTable<NameType>();
  TextColumn<NameType> nameColumn;
  ListBox typeListBox = new ListBox();

  public void onModuleLoad() {
    typeListBox.addChangeHandler(this);
    nameColumn = new TextColumn<NameType>() {
      @Override
      public String getValue(NameType object) {
        return object.getName();
      }
    };
    ct.addColumn(nameColumn, "Name");

    TextColumn<NameType> name1Column = new TextColumn<NameType>() {
      @Override
      public String getValue(NameType object) {
        return object.getType();
      }
    };
    ct.addColumn(name1Column, "Name1");

    List<NameType> values = new ArrayList<NameType>();

    NameType nameType1 = new NameType("name1", "type1");

    NameType nameType2 = new NameType("name2", "type2");

    values.add(nameType1);
    values.add(nameType2);
    ct.setRowData(values);

    ct.setLoadingIndicator(null);
    typeListBox.addItem("type1");
    typeListBox.addItem("type2");
    HorizontalPanel hp = new HorizontalPanel();
    hp.add(typeListBox);
    hp .add(ct);


    RootPanel.get().add(hp);
  }

  @Override
  public void onChange(ChangeEvent event) {
    String type = typeListBox.getValue(typeListBox.getSelectedIndex());
    int rowCount = ct.getRowCount();

    for(int i=0;i < rowCount; i++) {
      String value = ct.getRowElement(i).getCells().getItem(1).getInnerText();

      if(type.equals(value)) {
        Window.alert("came here");
        TableCellElement cellElement = ct.getRowElement(i).getCells().getItem(0);
        cellElement.addClassName("information icon");
      }
    }
  }
}

在onChange()方法中，这是我根据列表框中的选择添加类名的逻辑。但我正在寻找更通用的解决方案：）

Answer 1

我不知道在表格渲染后细胞内容的操作方式。但是我有一个不太好但可行的想法：将一些id或自定义HTML属性渲染到您的单元格中，以便以后可以通过标准但非GWT DOM操作来访问它们：

<td><img src=".." id="icon-of-entity-123" /></td>

如果你实现了这样的事情，那么在你的业务逻辑中，即使在渲染后你也可以在低级别操作它：

Element e = DOM.getElementById("icon-of-entity-" + getId());
e.setAttribute("class", "someclassname");

我希望有人能给你一个更好的解决方案！

为gwt中的celltable单元格添加动态样式名称

1 个答案: