Vaadin 8 Grid: ItemClickListener doesn't work with some column renderers?

Hi,

if you open
Vaadin Sampler - Grid - Column renderers
and position your mouse cursor directly at rendered “images” inside cells that are rendered by ProgressBarRenderer, or HTMLRenderer, or probably some others, and try to activate ItemClickListener by simply clicking the mouse, you will notice that it doesn’t work. The attached video demonstrates the case. And if the rendered “image”, (inline SVG for instance, used with HTMLRenderer) occupies all of the cell’s space, which is a common case, ItemClickListener has zero chances for this cell. Looks dissapointing.

The question: is it considered normal, or is it an issue? Any workarounds?

Thanks.
41007.gif

That’s correct, Grid is ignoring events that originate from a child widget. The reason is that many widgets forget to stop event propagation even after handling the event.

I remember there was an issue about this topic on Github but I cannot find it right now.

One could override this behaviour on the client side by
adding custom click handlers
, creating custom click events and
overriding the ignoreEventFromTarget() method
similar to how it is implemented in TreeGrid. This is not the simplest task and requires client side implementation but is definitely possible.

Thanks Adam,

I will consider your proposals.

Hi, there is another, much easier way you could try. Since 8.3 there is the Column#setHandleWidgetEvents(boolean) method that you can use to force Grid to handle events on a given column. So if you apply this setting to a certain column, the row will be selected even when the user clicks on a widget inside a cell (if the widget didn’t stop propagation).

Hi Adam,

yes, it’s the only reasonable way. Great! I already solved the problem with AbstractJavaScriptRenderer, by implementing the render(cell, data) method at Js level, and managing “click” event listeners (add/remove). However,
several issues with 8.3.0
will stop me from using it at production level until they are closed.

Thank you very much!