Use Edit/Create screens when user presses button on AbstractJavaScriptComponent

Support
#1

Hi,

I have an AbstractJavaScriptComponent that uses jQuery. It has buttons on it to add entities, at the moment I am using URLs that direct to e.g. open?screen=entity$Entity.edit&item=entity$Entity-112532-sda-3324-323-

However that is very slow, and I’m sure there is a better way to on click, go back to the server and just display the edit screen in a Dialog or new tab - how would I go about doing that?

Thanks!

#2

Hi,

You need to register the function to be called from a client-side, for example:

public MyComponent() {
    addFunction("onClick", new JavaScriptFunction() {
        @Override
        public void call(JsonArray arguments) {
            // do something
        }
    });
}

and call this function in the JavaScript connector:

window.com_example_MyComponent =
    function() {
        ...
        var connector = this;
        mycomponent.click = function() {
            connector.onClick(mycomponent.getValue());
        };
    };

Read the RPC from JavaScript to Server-Side section from the Vaadin documentation for more details.

Regards,
Gleb

#3

Hi Gleb,

Thanks for the reply. Given the click-through how would I then redirect the user to either a Dialog or a new tab showing the edit screen from the component class?

Thanks

#4

Use the openEditor() method to open editor screen. You can specify how to open the screen: DIALOG, NEW_TAB, THIS_TAB. Read more in the documentation here and here.

Pay attention that the openEditor() method is available in a screen controller. If you need to obtain the current frame to open an editor from a component class, you can use the following:

AppBeans.get(WindowManagerProvider.class).get().openEditor(...);

Regards,
Gleb

#5

Hi Gleb,

Thanks, sorry for so many questions, but got to the point where I’m trying the openEditor command you give above, but it requires a WindowInfo parameter as the first param - I’m assuming I need to create a new WindowInfo(“screen$Sample”, [What goes here?])

The second parameter is an Element which needs to be the element of the screen.xml? How do I get that?

Thanks

#6

Hi,

I would recommend using WindowConfig to obtain a WindowInfo instance, for example:

WindowConfig windowConfig = AppBeans.get(WindowConfig.NAME);
WindowInfo windowInfo = windowConfig.getWindowInfo(windowAlias);

Regards,
Gleb