Take the 2-minute tour ×

I'm optimizing a GWT application that previously used a variety of nested panels to work with DIVs and Spans. I generate the entire table as a single SafeHtml object and then assigning it into a single SafeHtml widget.

I now want to be able to track mouseover/mouseout events at the level of the specific 'cell' spans rather than the entire table, but I'm not sure how to do this.

If I add a handler to the HTML widget itself, I'll get events sourced at various elements.

share|improve this question

2 Answers 2

Since 2.0 there is quite a simple way to do it. For example if you HTML code is contained in some kind of widget (HTMLPanel or HTML), you can calladdDomHandler(<handler>,<eventtyoe>) on that widget, so you will receive events from inner html. For example if you have a bunch of anchors inside HTMLPanel and you want to know which one was clicked you can do something like this:

panel.addDomHandler(new ClickHandler() {

        public void onClick(ClickEvent event) {
            Element element=  event.getNativeEvent().getEventTarget().cast();
            if(element.getTagName().equals("A")) {
                AnchorElement anchor = element.cast();
                Window.alert("Anchor with href " + anchor.getHref() + " was clicked");

    }, ClickEvent.getType());

Since you want to track mouseover/out events you will have to use 2 different dom handlers, find out cell you need when event is fired and then change its state.

share|improve this answer

The way to approach this is:

  • Find the element you need with one of the DOM methods, like DOM.getElementById(..) or any other means. View Widget.getElement() etc.
  • Call DOOM.sinkEvents(element,eventBits) or DOM.sinkBitlessEvent(element,eventName) and pass the required events you want to sink in form of a bitmask, like Event.MOUSEEVENTS or using a named event like click or touchstart if using the second method.
  • set and EventListener on the element, by calling DOM.setEventListerner(element,eventListener) like so:

    DOM.setEventListener( element, new EventListener()
        public void onBrowserEvent( Event event )
            if ("click".event.getType()) {
               // ..do stuff..
    } );

Only events you've specified in step 2 will be fired to your EventListener, so you need to only handle those.

share|improve this answer
This is too prone to memory leaks (at least in IE). You have to make sure you setElementListener to null to avoid leaks; which is what widgets are for. See code.google.com/p/google-web-toolkit/wiki/… –  Thomas Broyer Nov 18 '11 at 15:39

Your Answer


