Table row not selectable when pointing to checkbox

Hello Vaadin,

is there a solution to make a row selectable when pointing to a checkbox?

The row is only selectable when pointing into anohter area of a row than the checkbox.



Hello Vaadin Forum, hello Vaadin,

is there any assistance for this forum?

Does it pay off to put messages here inside?

Not sure what you mean. I can select rows by clicking the area around the checkbox. If you want a row to be selected when you check the checkbox, then you can add a value change listener (to the checkbox) and call

Tested with 7.3 (Valo).

Hello Jacim, thanks for answer sorry for my late response.

No, I can´t select the row when pointing to a checkbox in the table row.

Independent if it is direct on the checkbox or in it´s cell space and even if not or is read only.

I need to point to the next cell in the row to get the row selected (means row is shown inverted).

Hi alex,

So what you mean here, is that the checkbox steals the click event when clicking inside the table cell where the checkbox resides?

Since your check boxes look like they are not enabled (thus, should not be clickable), you could actually make them click-through like this:

.v-checkbox label {
pointer-events: none;

.v-checkbox {
pointer-events: none;
[/code]That should pass the click through to the underlying table instead. For IE, check this out:

Hello Johan,

thanks for the hint with the event. I removed all event handlers to test it. The one of the checkbox and the one for the table.

Problem keeps the same: The row gets not be inverted when I click in the checkbox´area (even if clicking on the checkbox itself).

The checkbox itself is enabled and is okay and can be checked or unchecked.

Okay, it´s not a big problem - the user can choose the row when clicking in other cells.
But the thing came up at testing and it seems and it confuses if you had a couple of checkboxes in a row.

Don´t know - could it be a feature?

Well, somehow you should be able to click those check boxes too (if they are enabled)? I assume clicking inside the box, you would want only the check box selected/unselected, but clicking outside of it should invert the row.

So, which theme are you using? Also, are you on Vaadin6 or 7?

(For V7)
First tried an empty box with valo-theme and found that there was no problem (except a few pixels, but still acceptable)
Then I tried reindeer, there was indeed some space that made the row unclickable => not good.

What you could try, is to set the check boxes to some 10 pixels wide:


(or then use the cellStyleGenerator to give a style name to the wrapper).

It seems to solve the problem with reindeer at least, but please tell me if it didn’t work

Thanks for help!

It seems to be a Vaadin 7.3 problem with Reindeer…

I followed your advice and modified it with checkBox.setWidth(“10px”).

Now, it is OKAY!

Uff, this layout issues makes me confuse - it takes hours or days to solve it…

Thanks for helping me!

Glad I could help!
You’re welcome