Question

I’m creating a custom implementation of the GWT Header<String> class for use on a DataGrid Column that also uses a ListHandler to sort the data in this column. I’m attempting to handle and cancel Browser events in the Header class such that if a user clicks on a particular <INPUT> Element rendered by this custom Header object, we prevent the “mousedown” Event from bubbling back up to the DataGrid’s event handler(as this incorrectly triggers the ListHandler‘s column sorting methods, preventing the user from entering data into the <INPUT> Element in question).

I’m able to successfully isolate the events whose bubble up we want to “cancel” by implementing a NativePreviewHandler in my Header class with the following code:

        @Override
        public void onPreviewNativeEvent(NativePreviewEvent event) {
            final NativeEvent natEvent = event.getNativeEvent();
            final Element element = natEvent.getEventTarget().cast();
            final String eventType = natEvent.getType();                 
            if ("mousedown".equals(eventType)) {
                if (element.getTagName().equals("INPUT")) {
                    natEvent.preventDefault();
                    natEvent.stopPropagation();
                    event.cancel();
                }
            }
            return;
        }    

Unfortunately no combination of the preventDefault(), stopPropagation(), or event.cancel() methods successfully stop the mousedown event from bubbling up to the parent DataGrid‘s handlers. When I attempted to debug this issue, I was able to confirm that although DOM.previewEvent method successfully called the DOM.eventCancelBubble and DOM.eventPreventDefault, the DOM.dispatchEvent method was still fired and ultimately triggered the DataGrid.fireEvent and a ColumnSortEvent.

Any guidance/approaches to prevent the GWT DataGrid from resorting itself if a particular portion of a custom Header is clicked would be greatly appreciated!

Answer 1

You can prevent the sorting of columns on Header click, with the following code snippet, by overriding onBrowserEvent2 API of DataGrid.

@Override
protected void onBrowserEvent2( Event event )
{
    EventTarget eventTarget = event.getEventTarget();
    if ( !Element.is( eventTarget ) )
    {
        return;
    }
    final Element target = eventTarget.cast();
    String id = target.getId();
    if ( id != null && id.equals( COLUMN_HEADER_ID ) )
    {
        return;
    }
    super.onBrowserEvent2( event );
}