I have a VerticalLayout containing two (big) components: a grid and a chart. The chart is updated according to the selection in the grid. I am using the replaceComponent method of VerticalLayout for this. So, when selecting an item in the grid, the chart is updated but the browser scrolls up instead of keeping the scroll position. This is probably because Vaadin first removes the chart from DOM and then adds the new one.
Is it possible to keep the scroll position while replacing components?
I didn't find any answer on the net so far. I can make a SSCCE if necessary.
Thanks to André I found out that setting a fixed height on the replaced component solved the problem. Here is a SSCCE:
@Override
protected void init(VaadinRequest request) {
VerticalLayout layout = new VerticalLayout();
layout.setMargin(true);
layout.setSpacing(true);
setContent(layout);
TextField t1 = new TextField("Big field (1)");
t1.setWidth("300px");
t1.setHeight("1000px");
layout.addComponent(t1);
TextField t2 = new TextField("Big field (2)");
t2.setWidth("300px");
t2.setHeight("1000px");
layout.addComponent(t2);
final Component[] toReplace = new Component[] { t2 };
Button button = new Button("Click Me");
button.addClickListener(event -> {
Table t = new Table();
t.addContainerProperty("Name", String.class, null);
for (int i = 0; i < 20; i++) {
t.addItem(new Object[] { "" + i }, i);
}
//t.setHeight("200px");
layout.replaceComponent(toReplace[0], t);
toReplace[0] = t;
});
layout.addComponent(button);
setContent(layout);
}
When the height is not set, the scroll problem occurs.