3

Update #2: It turned out that our project setup was not optimal, which is why I had to manually copy the updated VAADIN folder with the theme to another location. The problem was not caused by vaadin but our project setup.
Thank you @SteffenHarbich and the Vaadin-Devs who helped me find the source of my problem here and in the issue ticket.

I am using Vaadin Framework 8.2.0 and I have a Grid with SelectionMode.MULTI

Because of the multiselection mode an additional column appears with checkboxes to select rows, which is fine!
But: these Checkboxes also have a label with the Text Selects row number XX. This label bothers me very much and I can't find a way to remove them.

enter image description here

In the Demo from Vaadin there are no such labels, so I'm sure that it can be achieved somehow.

Hiding the labels with CSS does not help me here, because the column width stays as if there was a label.

Here is my simplified code:

Grid<MyItem> myGrid = new Grid<MyItem>(MyItem.class);

myGrid.setSelectionMode(Grid.SelectionMode.MULTI);

myGrid.getEditor().setEnabled(true);
myGrid.setColumnReorderingAllowed(true);

//all columns match membervariables of MyItem. I use setColumns in order to control which fields are shown (not all of them are)
myGrid.setColumns(GRID_COLUMNS);  

myGrid.getColumn("foo").setHidable(false).setCaption("bar");
// configure each column similarly

myGrid.getColumn("foo").setEditorComponent(new TextField());
// some more setters of editorComponents and editorBindings

// finally, set items.
// binder contains a bean that has many MyItems. binder is of type com.vaadin.data.Binder;
myGrid.setItems(binder.getBean().getMyItems());
kscherrer
  • 5,486
  • 2
  • 19
  • 59
  • Please post your code. When I activate multi selection the new column just contains the checkbox. I'm using Vaadin 8.1.6. – Steffen Harbich Jan 10 '18 at 08:22
  • @SteffenHarbich I added a simplified version of my code. – kscherrer Jan 10 '18 at 08:41
  • @SteffenHarbich thank you for your comment, I downgraded to 8.1.6 and there is no label anymore, only the checkbox. Writing a ticket right now. – kscherrer Jan 10 '18 at 09:48
  • Even more strange, I updated to Vaadin 8.2.0 and it still works for me. – Steffen Harbich Jan 10 '18 at 09:57
  • 1
    wait.. what?? I am officially confused – kscherrer Jan 10 '18 at 09:58
  • Did you rebuild the widgetset and themes (if you customized them)? – Steffen Harbich Jan 10 '18 at 09:59
  • there is a customized widgetset in the project which only inherits the defaultwidgetset. BUT in my only UI class i use `@Widgetset("com.vaadin.v7.Vaadin7WidgetSet")` since there are still some compatibility components. i am in the process of refactoring/upgrading them. I have vaadin-compatibility-themes as a dependency. – kscherrer Jan 10 '18 at 10:23
  • I can see the `` HTML tag in my page source but it is not visible (hidden by CSS I guess). That's why I thought it might be a problem with widgetset/theme. – Steffen Harbich Jan 10 '18 at 10:41
  • I tried hiding it with css. it hid the labels but the columnwidth was still as wide as if it were there. But im gona try it again to be sure – kscherrer Jan 10 '18 at 10:43
  • @SteffenHarbich thank you for your help, I could solve the problem. see [my ticket](https://github.com/vaadin/framework/issues/10509) for details. – kscherrer Jan 10 '18 at 12:38

2 Answers2

2

See the corresponding ticket on github. Problem was old theme CSS.

Steffen Harbich
  • 2,639
  • 2
  • 37
  • 71
1

Add your theme with

.v-assistive-device-only-label  label {
    font-size:0;
    width: 0px; 
}
Thomas Oltzen
  • 21
  • 2
  • I don't know why but the relevant css rule ".v-assistive-device-only, .v-assistive-device-only-label label {...}" is not generating into my style.css, perhaps of using compatibility mode or of my limited knowledge. Nevertheless I'v followed you idea and copy paste this part into my style.scss from generated style.css I did found under this link https://demo.vaadin.com/sampler/#ui/grids-and-trees/grid/multi-select – San Droid Apr 18 '18 at 08:59