Executing JavaScript in the Browser

You can use server-side Java to execute simple JavaScript snippets in the browser. You can also pass parameters to the executed script as variables named $0, $1 and so on. Vaadin automatically serializes and escapes the parameter values.

Example: Executing JavaScript in the browser and passing parameters.

public static void logElementSize(String name,
        Element element) {
    Page page = UI.getCurrent().getPage();

    page.executeJs(
            "console.log($0 + ' size:', "
            + "$1.offsetWidth, $1.offsetHeight)",
            name, element);
}

The supported parameter types are String, Boolean, Integer, Double, JsonValue and Element.

The script is executed after the DOM tree has been updated based on server-side changes. The parameter value is null for a parameter of type Element that is not attached after the update (according to the server-side component structure)

Note	JavaScript evaluation scope The `page.executeJs()` method runs the JavaScript in the scope of the page (i.e. the `window` object). Component and element scoped access is described in Element API, Remote Procedure Calls.

Note	The script is executed asynchronously, so you cannot directly pass values back to the server. Instead, the returned `PendingJavaScriptResult` instance can be used to add a callback that is run when the result is available.

Vaadin provides a ready-made solution (without custom JavaScript execution) to listen to browser window-resize events for the from the server side. See Browser Window Resize Events for more.

623DA1C6-4474-4EEA-9CDB-736E45F49242

Docs

Docs

Executing JavaScript in the Browser