v-grid-sidebar open left: 0px in element.style ? Unusable

Hello all,

I upgraded from Vaadin 7.6.4 to 7.7.0 the other day, and since I’m having some issues with the Grid component.

Where before the grid sidebar for selecting visible columns used to be off the edge of the scren (to the right) of the popup button, now its to the left (correct) BUT its 100% the width of the screen.
It is totally unusable, and I can’t find how to stop it.

If I use Chrome Developer tools to examine the popup:

v-grid-sidebar v-grid-sidebar-popup v-contextmenu open

, I see the following as its element.style:

element.style {margin-left: 0px; margin-top: 0px; z-index: 20000; visibility: visible; overflow: visible; position: absolute; left: 0px; top: 635px; } That ‘left: 0px’ is what is causing the problem. If I modify it with Chrome Developer tools (to remove or set as Auto) it works as expected. (it is not 100% width of screen, and is laid out correctly).

I just cannot for the life of me find where it is getting that 0px for left.
I read that element.style values are set by javascript, and I am not sure why it would be doing that for me.

Does anyone know what I can do about this? I can’t seem to override it.
Such a ‘minor’ thing to rear its head, and yet I’ve been looking at it for hours…

Thanks all

Hi, any chance to share some code? I could have a look at it and try to find out what’s going on.

Sure… It’s pretty standard stuff.

BeanContainer beans = new BeanContainer(tableClass);
Iterator tableObjsIT = tableObjects.iterator();
int count = 0;
while(tableObjsIT.hasNext()) {
   Object entry = tableObjsIT.next();
   beans.addItem(new Integer(count++),entry);
}
      
int numberColumns = tableLayout.getTableLayoutColsWide();
      
com.vaadin.ui.Grid table = new com.vaadin.ui.Grid(tableLabel, beans);
table.setReadOnly(!editable);
table.setImmediate(true);
table.setSizeFull();
table.addStyleName("GeneratedTable");
table.setColumnReorderingAllowed(true);
      
table.setSelectionMode(SelectionMode.MULTI);

The Style for generated table is:

   .GeneratedTable {
     border: none !important;
   }

As stated above, it was working in 7.6.4 though (*although off the edge of the page to the right) and after updating Vaadin to 7.7.0 and regenerating widgetsets, it is doing this.
Nothing else changed.

I’m thinking maybe I just need to do a rebuild from scratch or something… This is just odd.
(I’m also seeing that my column resizing doesn’t work now on the above Grid - another issue I raised).

Maybe you have to update the theme as well.

Well I’m back on this project after a couple of months doing some other urgent work.
And this still has me stumped.
I’m posting here to bump the topic… hopefully someone might see something they know about to fix it ‘properly’.

I ended up setting a “left: auto !important;” under the base theme for generic sidebar handing:

[code]
// Sidebar

.#{$primaryStyleName}-sidebar.v-contextmenu {
@include box-shadow(none);
border-radius: 0;
position: absolute;
top: 0;
right: 0;
left: auto !important; /* Updated manually to fix offset context menu being left: 0 */
[/code]It has made it display correctly, but I dislike having to modify a core -sidebar style to get it to not have element.style override this.
(especially given this isn’t normal behaviour…)
Oh well… it works…