将GWT小部件插入div元素

Question

我使用的是一个GWT库(gwt-openlayers)，它允许我创建一个包含任意HTML的地图弹出，类似于Google。我需要这个HTML来包含一个GWT Button小部件。

我正在创建一些HTML元素，如：

Element outerDiv = DOM.createDiv();
outerDiv.getStyle().setOverflow(Overflow.HIDDEN);
outerDiv.getStyle().setWidth(100, Unit.PCT);
outerDiv.appendChild(new HTML(mapPOI.getHtmlDetails()).getElement());
Button popupButton = new Button("View Property");
popupButton.getElement().getStyle().setFloat(com.google.gwt.dom.client.Style.Float.RIGHT);
outerDiv.appendChild(popupButton.getElement());

然后，通过调用

String src = outerDiv.toString();

把这个html插入我的地图标记。现在，我的地图标记显示内容ok，包括按钮。但是，按钮不会对任何事件做出响应！据我所知，这是因为按钮onAttach()方法从未被调用过。

有更好的方法吗？

谢谢,

琼恩

编辑

我现在正在尝试一种新的方法来做到这一点，这似乎是在查看其他类似帖子时被接受的方法。

首先，我创建了我的div：

String divId = "popup-" + ref;
String innerHTML = "<div id=\"" +divId + "\"></div>";

然后，我将其添加到我的地图弹出并显示它(这将它添加到DOM)。在弹出窗口显示之后，我将得到如下元素，并试图将一个HTMLPanel封装在它周围：

Element element = Document.get().getElementById(divId);
HTMLPanel popupHTML = HTMLPanel.wrap(element);

成功地检索了我的div元素。然而，HTMLPanel.wrap(element);并没有完成。这样做的原因是wrap(..)调用了RootPanel.detachOnWindowClose(Widget widget)，其中包括以下断言：

assert !widgetsToDetach.contains(widget) : "detachOnUnload() called twice "
    + "for the same widget";
assert !isElementChildOfWidget(widget.getElement()) : "A widget that has "
    + "an existing parent widget may not be added to the detach list";

我在里面放了一些断点，似乎第二个断言失败了！

有人知道为什么会这样吗？失败这个断言真的会导致方法的完全失败(没有返回)吗？

Answer 1

第一种方法很好，只需为按钮注册onClick事件，如下所示：

DOM.sinkEvents(popupButton.getElement(), Event.ONCLICK);
DOM.setEventListener(popupButton.getElement(), new EventListener() {
    @Override
    public void onBrowserEvent(Event event) {
        //implement the logic after click
    }
});

我已经查过了，它100%有效！

Answer 2

你可以尝试这样的方法

RootPanel.get("idOfYourMapMarker").add(popupButton);

请参阅RootPanel.get()

不幸的是，RootPanels是AbsolutePanels，虽然布局不太好，但是只要添加一个简单的按钮就可以工作了。您也可以尝试RootLayoutPanel，这将给您一个LayoutPanel (当您只想让事物流动时也不太好)。您可能最终会创建一个为您执行布局的容器小部件，并将其添加到RootPanel中。

Answer 3

SimplePanel是一种DIV。也许可以用它来代替？