It is very easy to call Aavascript
from GWT
java code by making use of JSNI
. But calling GWT
java code from external Javascript
of JSNI
is little tricky and it becomes more complicate when you have to call instance method of a GWT
java class. For more detail refer GWT
official document
(refer)
Call static class method from JavaScript
GWTCode.java
package open.pandurang.client.view;
/**
* @author Pandurang Patil 18-Mar-2014
*
*/
public class GWTCode {
public static String hello(String name) {
return "Hello " + name + "!";
}
public static native void exportMethod() /*-{
$wnd.gwtcode_hello = function(name) {
return @open.pandurang.client.view.GWTCode::hello(Ljava/lang/String;)(name);
};
}-*/;
}
Refer this line $wnd.gwtcode_hello = function(name) {
we are exposing this GWTCode.hello
method and assign it to window.gwtcode_hello
.
Refer line return @open.pandurang.client.view.GWTCode::hello(Ljava/lang/String;)(name);
Please note there are two ( )
brackets, first one will declare parameter types (Ljava/lang/String;)
and second will take actual parameters (name)
. Don’t worry if you are using eclipse when you press CTRL + SPACE
after method name it will populate corresponding type. Now from Javascript
code you can call window.gwtcode_hello("<name>")
method.
NOTE: If method don’t take any argument then this line will look like return @open.pandurang.client.view.GWTCode::hello()();
Entry Point class
Sample.java
package open.pandurang.client.view;
import com.google.gwt.core.client.EntryPoint;
/**
* Entry point classes define <code>onModuleLoad()</code>.
*/
public class samples implements EntryPoint {
public void onModuleLoad() {
GWTCode.exportMethod();
}
}
In above sample you will see we are calling GWTCode.exportMethod();
to export the GWTCode.Hello
method.
sample.html
<!doctype html>
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<title>Samples and trials</title>
<script type="text/javascript" language="javascript" src="sample/sample.nocache.js"></script>
</head>
<script type="text/javascript" language="javascript">
function jsGwtCallTest() {
var msg = window.gwtcode_hello("Pandurang");
alert(msg);
}
</script>
</head>
<body>
<!-- OPTIONAL: include this if you want history support -->
<iframe src="javascript:''" id="__gwt_historyFrame" tabIndex='-1' style="position: absolute; width: 0; height: 0; border: 0"></iframe>
<!-- RECOMMENDED if your web app will not function without JavaScript enabled -->
<noscript>
<div
style="width: 22em; position: absolute; left: 50%; margin-left: -11em; color: red; background-color: white; border: 1px solid red; padding: 4px; font-family: sans-serif">
Your web browser must have JavaScript enabled in order for this application to display correctly.</div>
</noscript>
<button onclick="jsGwtCallTest();">test</button>
</body>
</html>
we are calling this method on event of button click
. You will not see any issues here but if you are calling this method from other .js
file on some events like on page load or something. You need to make sure gwt
entry point has been executed and exported the method.