Titled frame panel for GWT (using FIELDSET and LEGEND html tags)

Question

I'm trying to create a titled border frame in GWT, which results in this:

This can be done using HTML fieldset and legend tags, such as

<fieldset> 
    <legend>Connection parameters</legend>
    ... the rest ...
</fieldset>

I want to create a custom widget in GWT that implements that. I managed to do that, but the problem is that events that happen inside the widget (button click etc) does not get fired although I have added the handler.

My implementation of the widget is as follows:

public class TitledPanel extends Widget {
private Element legend;
private Widget content = null;

public TitledPanel() {
    Element fieldset = DOM.createFieldSet();
    legend = DOM.createLegend();
    DOM.appendChild(fieldset, legend);
    setElement(fieldset);
}

public TitledPanel(String title) {
    this();
    setTitle(title);
}

@Override
public String getTitle() {
    return DOM.getInnerHTML(legend);
}

@Override
public void setTitle(String html) {
    DOM.setInnerHTML(legend, html);
}

public Widget getContent() {
    return content;
}

public void setContent(Widget content) {
    if (this.content != null) {
        DOM.removeChild(getElement(), this.content.getElement());
    }

    this.content = content;

    DOM.appendChild(getElement(), content.getElement());
}
}

Do I need to extend Composite, or need to manually reroute the events, or is there other ways?

Answer 1

I think you're looking for CaptionPanel:

A panel that wraps its contents in a border with a caption that appears in the upper left corner of the border. This is an implementation of the fieldset HTML element.