John
John

Reputation: 477

How to make Vaadin 10 components change one by one from click event?

For some reason components are always changed from button click simultaneously.
I need to change them one by one. Here is the example:

countButton.addClickListener(buttonClickEvent -> {
    int input = Integer.parseInt(inputTextField.getValue());

    long factorialResult = countFactorial(input);
    resultFactorialLabel.setText("Factorial: " + factorialResult);

    //just for example, could be processing that takes really long
    try {
        sleep(1000);
    } catch (InterruptedException ignored) {
    }

    int fibonacciResult = countFibonacci(input);
    resultFibonacciLabel.setText("Fibonacci: " + fibonacciResult);
});

When I run it - 10 seconds passes, then resultFactorialLabel and resultFibonacciLabel change simultaneously, when I want resultFactorialLabel to be changed and after that, in 10 seconds, resultFibonacciLabel to be changed. How can I do it?
And how is it made so, that labels change simultaneously?

Vaadin version: 10.0.1

Upvotes: 2

Views: 235

Answers (1)

Steffen Harbich
Steffen Harbich

Reputation: 2749

This is the usual lifecycle:

  • An event occurs on the client side (browser), e.g. a click on a button.
  • This makes a HTTP call to the server (your Vaadin application).
  • Vaadin processes the call, firing the event on the server, i.e. executing all registered listeners for the event, e.g. your click listener.
  • In the listener, you do some changes on the (server-side) components, e.g. updating a label.
  • After that, a response is sent to the client containing information about all the changed components.
  • Then, on the client side, the HTML is updated to reflect the changed components.

So if you do a sleep within your listener, it will just delay the response to the client.

If you need to do an expensive operation triggered by the button click, you should do it in a background thread and update the UI once the operation is complete. See docs for how to update UI from a background thread.

Upvotes: 2

Related Questions