CODEWITHSUNDEEP
vaadinvaadin-gridvaadin-flow
Leo Brousset
Leo Brousset

Reputation: 1

How to add a grid in an dialog

I need to put a grid in dialog but the grid is very small.

Grid<FermetureGagnanteTexte> fermetureGagnanteTexteGrid = new Grid<>(FermetureGagnanteTexte.class,false);
verticalLayout.add(fermetureGagnanteTexteGrid);
dialog.add(verticalLayout);`
dialog.open();

The grid is very small in the dialog.

Upvotes: 0

Views: 1151

Answers (2)

Stainless Steel Rat
Stainless Steel Rat

Reputation: 91

If you are using Vaadin Flow, put the grid into a Div() instead of a VerticalLayout. Add the Div to the Dialog and set the Dialog's size. The Grid should fill the space and scroll.

Grid<FermetureGagnanteTexte> grid = new Grid<>(FermetureGagnanteTexte.class);
Dialog dialog = new Dialog();
Div div = new Div();
div.add(grid);
dialog.add(div);
dialog.setWidth("600px");

dialog.open();

S.

Upvotes: 0

d2k2
d2k2

Reputation: 714

Here is a solution for Vaadin 8 by using the Window Component.

By the description of your problem i assume that you did not set any size attributes with setWidth, setHeight or setSizefull. Even my code example is specific for Vaadin 8 it should also apply to the Dialog-component for Vaadin-Flow.

enter image description here

import com.vaadin.server.VaadinRequest;
import com.vaadin.spring.annotation.SpringUI;
import com.vaadin.ui.Grid;
import com.vaadin.ui.UI;
import com.vaadin.ui.Window;

@SpringUI
public class TestUI extends UI {

    @Override
    protected void init(final VaadinRequest request) {

        showGridInWindow();

    }

    private void showGridInWindow() {

        final Window window = new Window("Window Caption");

        final Grid<Object> grid = new Grid<>();
        grid.addColumn(Object::toString).setCaption("Column 1");
        grid.setSizeFull();

        final List<Object> items = new ArrayList<>();
        for (int i = 0; i < 50; i++) {
            items.add(new String("String #" + i));
        }

        grid.setItems(items);

        window.setContent(grid);
        window.setWidth("600px");
        window.setHeight("400px");
        window.setModal(true);
        window.setClosable(true);

        getUI().addWindow(window);
    }
}

Upvotes: 1

Related Questions