在GWT中，如何在celltable标题的顶部添加一行？

Question

这非常有趣，我们如何在GWT中的celltable标题上添加一行？

好吧，说，GWT Header只支持排序，但我也想在每个列上做其他的东西（比如过滤，隐藏......）

所以我想在celltable的标题顶部添加一行。在行上，有很多按钮，每个按钮对应一列。当用户单击按钮时，他们可以执行其他操作，例如过滤或隐藏。

示例：

Button1 - Button2 - Button3。

Header1 - Header2 - Header3。

细胞11-细胞12-细胞13。

细胞21-细胞22-细胞23。

更多细胞....

Answer 1

使用GWT的唯一方法是扩展CellTable实现，并在CellTable创建其标头的部分中创建自己的黑客代码。此外，你必须考虑添加许多方法来添加按钮，处理程序等。我之前已经处理过这个问题，这是一个非常繁琐的任务。

但是，您可以选择在创建表后修改DOM。有很多方法可以做到这一点，但我知道的更简单的方法是使用gwtquery aka gquery。

在你的情况下，我会使用这样的代码：

 // import gquery stuff
 import static com.google.gwt.query.client.GQuery.*;

 // Create your table and add its colums
 final CellTable<MyObject> celltable = ...
 [...] 

 // Delay until the table has been full rendered, I use gquery delay() because 
 // of its syntax but you could use Scheduler or Timer as well
 $(celltable).delay(0, new Function(){
    public void f() {

     // Now we add a div to each header, you could add any html though
     $("th", celltable).prepend($("<div class='mypanel' style='height: 40px'/>"));

     // gquery's widget plugin is able to promote certain dom elements 
     // like div/th/... etc into HTMLpanels
     GQuery panels = $(".mypanel", celltable).as(Widgets).panel();

     // gquery can return a sorted list of widgets asociated with a set of elements
     List<HTMLPanel> list = panels.widgets(HTMLPanel.class);

     // Now you can add any gwt widget to your panels
     for (int i = 0; i < list.size(); i++) {
       list.get(i).add(new Button("Button: " + i));
     }
   }
});

这里是产生上述代码的截图：

这种方法意味着您必须将gwtquery导入到您的项目中，但说实话，我不认为我在没有它的情况下开展GWT项目:-)，

当设计师要求增强gwt-widget时，Gquery会有很多帮助，你不想强制调整（大多数情况下意味着复杂的编码和调查）来做一些非常简单的事情，比如修改由widget生成的dom。

另外Gquery附带了很多你可以利用的东西，比如简单的ajax语法，promises，插件，使用js方法和属性而无需编写jsni等。

Answer 2

嗯，几乎不可能，在cell table.之外的标题上添加一行

但是你说的功能可以通过添加一个带有zero padding的horizantalpanel并将buttons添加到该面板来实现（显然，按钮的宽度应该与列宽相同并且css很小。）

点击每个按钮，您可以对celltable.

进行操作或排序

免责声明：这是我可能的解决方案。

Answer 3

自GWT 2.5起，应该可以提供自定义HeaderBuilder或扩展AbstractHeaderOrFooterBuilder / DefaultHeaderOrFooterBuilder来解决您的问题。
您可以查看此CustomTableGrid展示广告。 它定义了一个自定义CellTableBuilder，但同样的原则也应该适用于HeaderBuilder接口。