While creating the UTM Coordinate Converter applet, I was looking for examples on how to get a Java Applet, to call a Javascript function in the html. I found various bits of information and some examples (that didn't always work), and so decided I would pool the information and
try to give a clear tutorial on how to do this. This tutorial assumes
Java6 but should work for Java5 as well. I'm not too sure about earlier
version of Java.
Step 1: Get plugin.jar
plugin.jar contains the classes needed for an applet to call javascript functions. It is necessary to have plugin.jar in the classpath of your development environment.
Plugin.jar can be found in /lib directory of your java installation
(example on Windows: C:\Program Files\Java\jre6\lib). It is not
necessary to specify plugin.jar in the classpath when putting your
applet on your webpage, since the Java plugin will already have
plugin.jar (see example in Step 5)
Step 2: import required classes
In the Applet Code add the following import:
Code: | import netscape.javascript.JSObject; |
Don't worry about 'netscape' in the package name, it works for IE just fine.
Step 3: create your javascript function for your webpage:
Code: | <script type="text/javascript"> |
| //Javascript function |
| function testFunction(param1, param2) { |
| alert('Called by applet: ' + param1 + param2); |
| } |
| </script> |
In this example, the javascript just displays an alert box, but it could do anything you want. This function also accepts parameters, to show how parameters can be passed in. Note: the javascript can either be included directly in the HTML from a separate .js file.
Step 4: Add a call to the javascript in the applet java code
Code: | private void callJavascriptFunction(){ |
| try { |
| JSObject window = JSObject.getWindow(this); |
| String param1 = "Hello from "; |
| String param2 = "a Java applet"; |
| Object[] params = {param1, param2}; |
| window.call("testFunction", params); |
| } catch (Exception e) { |
| e.printStackTrace(); |
| } |
| } |
This Java function creates a JSObject object called window. It then
sets up a couple of parameters (as Strings) and puts them into an
Object array. It finally calls thejavascript function created earlier using the call() method and passes in the name of the javascript function, and the params array.
Step 5: Add applet to html page
Below is the way I add applets to HTML pages, which seems to work across all browsers. The key for the javascript to work is to include the param name="MAYSCRIPT value="true"
Code: | <!--[if !IE]>--> |
| <object classid="java:CoordinateConverterApplet.class" |
| type="application/x-java-applet" |
| codebase="../assets/applets" |
| archive="CoordinateConverter.jar" |
| width="450" height="760" > |
| <!-- Konqueror browser needs the following param --> |
| <param name="archive" value="CoordinateConverter.jar" /> |
| <param name="MAYSCRIPT" value="true" /> |
| <p>Coordinate Converter Applet</p> |
| <!--<![endif]--> |
| <object classid="clsid:8AD9C840-044E-11D1-B3E9-00805F499D93" |
| width="450" height="760" > |
| <param name="code" value="CoordinateConverterApplet" /> |
| <param name="codebase" value="../assets/applets/" /> |
| <param name="archive" value="CoordinateConverter.jar" /> |
| <param name="MAYSCRIPT" value="true" /> |
| <p>Coordinate Converter Applet</p> |
| </object> |
| <!--[if !IE]>--> |
| </object> |
| <!--<![endif]--> |
Step 6: Try it out!
In your Java Applet code, when you make a call to callJavaScriptFunction(), it will call the Javascript function, and if everything works correctly, it will display an alert box as follows:
To see a live working example of calling javascript from an applet, you can go to the UTM Coordinate Converter tool. In this tool, when clicking on a Convert button, the applet calls a Javascript function, passing in the coordinate, and the javascript updates the Google Map.
Link to JSObject API documentation: https://developer.mozilla.org/En/Core_JavaScript_1.5_Reference/LiveConnect/JSObject#getWindow
|