我想在 SmartGWT 的 ListGrid 的 HeaderSpan 中添加一个按钮。我尝试使用 'HeaderSpan.setAttribute((String property, Object value)) 方法，但它不起作用。以下是我尝试过的示例：-
ListGrid countryGrid = new ListGrid();
HeaderSpan ident = new HeaderSpan("Identification", new String[]{"countryCode", "countryName"});
ident.setAttribute("control", new Button("Test"));
countryGrid.setHeaderSpans(ident);
countryGrid.draw();
请帮忙！
【问题讨论】：
标签： smartgwt
最后我找到了将按钮添加到 HeaderSpan 的方法。以下是代码（为简洁起见，省略了导入语句）：-
public class AdvancedListGrid extends ListGrid {
public void setHeaderSpanButtons() {
this.getAttribute("headerSpans");
NodeList<Element> list = this.getElement().getElementsByTagName("td");
int length = list.getLength();
for(int index = 0; index < length; index++) {
Element element = list.getItem(index);
if(element.getInnerHTML().toString().equals("Identification")) {
element.setInnerHTML(null);
element.insertFirst(createHeaderSpanContents());
}
}
}
private Element createHeaderSpanContents() {
HLayout hLayout = new HLayout();
Button button = new Button("+");
button.setHeight(20);
button.setWidth(20);
button.addClickHandler(new ClickHandler(){
@Override
public void onClick(ClickEvent event) {
SC.say("Why did you click me?");
}});
Label title = new Label("Test Title");
title.setWidth(70);
title.setHeight(20);
hLayout.addMember(button);
hLayout.addMember(new LayoutSpacer());
hLayout.addMember(title);
return hLayout.getElement();
}
}
客户端类将调用 AdvancedListGrid.setHeaderSpanButtons() 方法将按钮添加到标题范围。当然，您可以自定义方法以满足您的需求。
【讨论】：
我正在测试它，因为我需要在 HeaderSpan 中放置一个日历。感谢您分享您的想法，这很有帮助，尽管设置正确的导入需要一段时间。
注意：setHeaderSpanButtons() 方法只有在设置了 ListGrid 的数据源时才有效。如果不是，则根本不显示任何标题。
一个改进：你可以在循环中添加一个break，不需要循环整个NodeList：
if(element.getInnerHTML().toString().equals("Identification")) {
element.setInnerHTML(null);
element.insertFirst(createHeaderSpanContents());
break;
}
一个问题：这行的目的是什么：
this.getAttribute("headerSpans");
最后，它对我不起作用 - 跨度始终保持为文本“标识”。有什么建议吗？
谢谢。
【讨论】：
this.getAttribute()。我的建议是使用element.setInnerHTML(calendarObject.getInnerHTML()); 而不是将innerHTML 设置为null。另外，从onDraw() 方法调用主要方法。我正在做的另一件事是通过调用DOMUtils.removeAllChildNodes() 方法删除所有子节点。在我的第二个答案中粘贴了详细代码。试试看。
你在 IE 上测试过吗？我在 FF 中进行了测试，它工作正常，但是在 IE 中单击我的应用程序时遇到问题。据我所知，这是由于 GWT 和 SmartGWT 的混合。所以我想最好在这个例子中使用 ToolStrip：http://www.smartclient.com/smartgwt/showcase/#grid_appearance_preferences
【讨论】：
import com.google.gwt.core.client.JavaScriptObject;
import com.google.gwt.dom.client.Element;
import com.google.gwt.dom.client.Node;
import com.google.gwt.dom.client.NodeList;
import com.smartgwt.client.widgets.events.DrawEvent;
import com.smartgwt.client.widgets.events.DrawHandler;
import com.smartgwt.client.widgets.grid.ListGrid;
public class AdvancedListGrid extends ListGrid {
public AdvancedListGrid() {
// Create the HeaderSpan with title "Identification"
addDrawHandler(new DrawHandler(){
@Override
public void onDraw(DrawEvent event) {
insertCalendar();
}});
}
public void insertCalendar() {
for(Element element : DOMUtils.getElementsByTagName("td")) {
if(element.getInnerHTML().equals("Identification")) {
createCalendar(element);
}
}
}
public void createCalendar(Element element) {
DOMUtils.removeAllChildNodes(element);
// Create the SmartGWT calendar object. Say the object cal.
element.setInnerHTML(cal.getInnerHTML());
}
}
class DOMUtils {
public static void removeAllChildNodes(Element element) {
NodeList<Node> childList = element.getChildNodes();
for(int childIndex = 0; childIndex < childList.getLength(); childIndex++) {
element.removeChild(childList.getItem(childIndex));
}
}
public static Element[] getElementsByTagName(String tagName)
{
JavaScriptObject elements = getElementsByTagNameInternal(tagName);
int length = getArrayLength(elements);
Element[] result = new Element[length];
for (int i=0; i<length; i++)
{
result[i] = getArrayElement(elements, i);
}
return result;
}
private static native JavaScriptObject getElementsByTagNameInternal(String tagName)/*-{
return $doc.getElementsByTagName(tagName);
}-*/;
private static native int getArrayLength(JavaScriptObject array)/*-{
return array.length;
}-*/;
private static native Element getArrayElement(JavaScriptObject array, int position)/*-{
return (position>=0 && position<array.length?array[position]:null);
}-*/;
}
【讨论】：
这是在没有 JSNI 或 DOM 的情况下进行的： 此网格在加载数据源时使用动态内容更新第二个 span 标头的内容。 或者，如果内容是静态的，您可以使用“onDraw”而不是“dataArrived”
import com.smartgwt.client.types.Alignment;
import com.smartgwt.client.widgets.Button;
import com.smartgwt.client.widgets.Canvas;
import com.smartgwt.client.widgets.grid.HeaderSpan;
import com.smartgwt.client.widgets.grid.ListGrid;
import com.smartgwt.client.widgets.grid.events.DataArrivedEvent;
import com.smartgwt.client.widgets.grid.events.DataArrivedHandler;
public class MyGrid extends ListGrid {
private HeaderSpan oneHeaderSpan = new HeaderSpan("span one", new String[] { "a", "b", "c" });
private HeaderSpan twoHeaderSpan = new HeaderSpan("span two", new String[] { "d", "e", "f" });
final private static String ONE_SPAN_ID = "span1";
final private static String TWO_SPAN_ID = "span2";
public MyGrid() {
setID("MyGrid");
setHeight100();
setWidth100();
setDataSource(MyDS);
setHeaderSpans(oneHeaderSpan, twoHeaderSpan);
oneHeaderSpan.setAttribute("spanId", ONE_SPAN_ID);
twoHeaderSpan.setAttribute("spanId", TWO_SPAN_ID);
setHeaderHeight(50);
addDataArrivedHandler(new DataArrivedHandler() {
@Override
public void onDataArrived(DataArrivedEvent event) {
Canvas headerSpans = Canvas.getById(getID() + "_headerSpan");
// getPeers() did not work for IE
for (Canvas peer : headerSpans.getParentCanvas().getChildren()) {
if (peer.getAttribute("spanId") != null && peer.getAttribute("spanId").equals(TWO_SPAN_ID)) {
peer.addChild(createHeaderSpanContents(event));
}
}
}
});
}
private Canvas createHeaderSpanContents(DataArrivedEvent event) {
// Your favorite Canvas here:
Button button = new Button();
button.setLayoutAlign(Alignment.CENTER);
button.setHeight100();
button.setWidth100();
button.setTitle("+");
return button;
}
}
如果您使用的是 4.1d 之前的 smartgwt 版本，则使用 headerSpans.getParentElement().getChildren()) 也可以使用
【讨论】：