Updating the page view after closing the modal window (Vaadin 8)

问题

I use Vaadin version 8.9.3. I need to show a modal window when I click a button. In this window, the user enters the information, clicks on the button, the information is saved and displayed in a table in the main window.

Main page:

Modal page:

To display the modal window I use BrowserWindowOpener. In order not to overload the question, I will give only a small piece of code. The FormLayout in which there is TextField("uid"), Grid and Button("Создать") - DeviceForm:

private BrowserWindowOpener opener = new BrowserWindowOpener(ButtlonClickUI.class);
private DeviceConfigsService configsService = DeviceConfigsService.getInstance(); 
private Grid<DeviceConfigs> grid = new Grid<>(DeviceConfigs.class);

public DeviceForm(MyUI myUI, Devices device) {
    opener.extend(button);
    opener.setFeatures("resizable");

    configsService.setDevice(device);
    configsService.addSaveEventListener(new OnSaveEventListener() { 
        @Override
        public void SaveEvent() {
            updateList();
        }
    });

    grid.setColumns(NAME_COLUMN, VERSION_COLUMN, STATE_COLUMN);

    grid.getColumn(NAME_COLUMN).setCaption(NAME_COLUMN_NAME).setExpandRatio(1);
    grid.getColumn(STATE_COLUMN).setCaption(STATE_COLUMN_NAME).setExpandRatio(1);
    grid.getColumn(VERSION_COLUMN).setCaption(VERSION_COLUMN_NAME).setExpandRatio(1);

    updateList();
}

public void updateList() {
    List<DeviceConfigs> configs = configsService.findAll();

    if(configs.size() == 0) {
        delete.setVisible(false);           
    }   

    grid.setItems(configs);
}

Here, config service is a service that allows you to save, delete and find the information displayed in the grid (DeviceConfigs), in this case, it does not matter which one. OnSaveEventListener is the listener I created, called when the save method in configsService is called:

public synchronized void save(DeviceConfigs entry) {
    if(entry == null) {
        LOGGER.log(Level.SEVERE, 
                "DeviceConfigs is null");
        return;
    }
    if(entry.getName() == null || entry.getName().isEmpty()) {
        LOGGER.log(Level.SEVERE, 
                "DeviceConfigs name is null");
    }
    try {
        entry = (DeviceConfigs) entry.clone();
    } catch (Exception e) {
        throw new RuntimeException(e);
    }

    device.putConfig(entry);
    if(listener != null) { listener.SaveEvent(); }
}

UI that is called in opener:

public class ButtlonClickUI extends UI {
    private DeviceConfigsService configsService = DeviceConfigsService.getInstance(); 
    private Button close = new Button("close", VaadinIcons.CLOSE);

    @Override
    protected void init(VaadinRequest request) {
        VerticalLayout layout = new VerticalLayout();
        layout.addComponent(close);
        ...
        close.addClickListener(event ->{    
            configsService.save(new DeviceConfigs(requestStr.getValue(), true, typeOfClick.getValue()));
            closeThis();
        });
    }

    private void closeThis() {
        JavaScript.eval("close()");
        // Detach the UI from the session
        getUI().close();
    }
}

The problem is this - I couldn't think of a better way to track the event of writing new data and closing the modal window to update the values of the table until I got to creating a listener. But now, after clicking the Close button in the modal window, it closes, the data is updated but not displayed until I interact with some element on the main page (by trial and error, I got to the point where the components on the main page will not update their visibility until the modal window closes and the main page returns focus). But I can't think of any way to automatically update the table values in the main menu when the modal window is closed. Any possible solution to the problem, please.

来源：https://stackoverflow.com/questions/59155821/updating-the-page-view-after-closing-the-modal-window-vaadin-8

标签

java

popup

vaadin

vaadin8

vaadin-grid