1

I'm trying to interact between Vaadin and amcharts. Basically I need to draw a map using amcharts libraries, and when I click on the map I need to send back information about the click to Java. My problem is that I can't figure out how to properly interact between the two, with the documentation showing very simple examples.

In the vaadin docs it shows an example like:

getElement().executeJS("jsMethodName($0)", getElement());

and then to send back data to Java:

element.$server.javaMethodName(args);

My problem is that I can send from Java to JS correctly, and the element is loaded correctly. But when I do element.$server.javaMethodName(), element.$server is always undefined. I don't understand if I'm missing something or if I dind't understand the correct way to use this.

This is my Java method:

    @ClientCallable
    private void clickBullet(String area) {

        log.error("Clicked area: " + area);
    }

and this is the call from JS:

function clickBullet(name, element) {
        if(element !== null){
            element.$server.clickBullet(name);
        }
        else {
            console.log("element is null");
        }

    }

Note that element is not null, it is correct. What am I doing wrong?

7
  • 1
    Is it possible that element is something else than what you expect it to be? You can add debugger; at your JS function and it will stop at a breakpoint there automatically. Commented Sep 15, 2021 at 11:43
  • @ollitietavainen maybe, I'll try. One thing that is not clear to me is if the element from which you call executeJS must be the same that you pass as an argument. Otherwise I guess you wouldn't be able to find the Java function (?). I don't know. Commented Sep 15, 2021 at 12:21
  • Have you taken a look at the JavaDoc of Element.executeJS and Element.callJSFunction? Commented Sep 15, 2021 at 12:29
  • Did you ever manage to get this sorted ? I'm having a very similar issue as described here stackoverflow.com/questions/74135342/… Commented Oct 21, 2022 at 8:33
  • @Sergiu Hi, it's been more than I year so I don't recall the actual solution I found, I know I managed to make it work and I'm looking now at the code to try and remember. One thing I did was to pass the element as a variable before, and then execute the server side call passing that element, instead of passing it directly. So something like getElement().executeJs("myElement = $0;", getElement()); and then use the variable myElement in the element.$server code. I'm sorry I can't be more useful, I really don't remember exactly what it was. Commented Oct 22, 2022 at 13:20

0

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.