how can i access some javaScript file from java in GWT

Question

I have helloJava.HTML in my GWT project , within that html file , i have this javascript code

                        <script type="text/javascript">
function testJavaScript(var input){
    var var1inJS = "Default value";

    alert("Value of Var1 = " + var1inJS);
    var1inJS = input;
    alert("Value of Var1 = " + var1inJS);

    var var2inJS = "Waht is the value of Var2";

    alert("Value of Var2 = " + var2inJS);

}

now i want to call this method from my onmoduleLoad class(i.e from my java class).

is it possible ?

hellojava.html file

                            <!doctype html>
<!-- The DOCTYPE declaration above will set the     -->
<!-- browser's rendering engine into                -->
<!-- "Standards Mode". Replacing this declaration   -->
<!-- with a "Quirks Mode" doctype is not supported. -->

<html>
  <head>
    <meta http-equiv="content-type" content="text/html; charset=UTF-8">

    <!--                                                               -->
    <!-- Consider inlining CSS to reduce the number of requested files -->
    <!--                                                               -->
    <link type="text/css" rel="stylesheet" href="HelloJSNI.css">

    <!--                                           -->
    <!-- Any title is fine                         -->
    <!--                                           -->
    <title>Web Application Starter Project</title>

    <!--                                           -->
    <!-- This script loads your compiled module.   -->
    <!-- If you add any GWT meta tags, they must   -->
    <!-- be added before this line.                -->
    <!--                                           -->
    <script type="text/javascript" language="javascript" src="hellojsni/hellojsni.nocache.js"></script>

    <script type="text/javascript">
    function testJavascript(var input){
        window.jsniAlert();
        var var1inJS = "Default value";

        alert("Value of Var1 = " + var1inJS);
        var1inJS = input;
        alert("Value of Var1 = " + var1inJS);

        var var2inJS = "Waht is the value of Var2";

        alert("Value of Var2 = " + var2inJS);

    }

    function callJava(){

    }
    </script>
  </head>

  <!--                                           -->
  <!-- The body can have arbitrary html, or      -->
  <!-- you can leave the body empty if you want  -->
  <!-- to create a completely dynamic UI.        -->
  <!--                                           -->
  <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>

    <h1>JSNI EXAMPLE</h1>

    <table align="center">
      <tr>
        <td colspan="2" style="font-weight:bold;"></td>        
      </tr>
      <tr>
        <td id="nameFieldContainer"></td>
        <td id="sendButtonContainer"></td>
      </tr>
      <tr>
        <td colspan="2" style="color:red;" id="errorLabelContainer"></td>
      </tr>
    </table>
  </body>
</html>

Travis Webb · Accepted Answer · 2012-04-07 02:58:26Z

2

Yes. This is approximately what you want:

public static native void callJavascript() /*-{
    $wnd.testJavaScript("hello");
}-*/;

and then call this method in your Java code: callJavascript();

Read Google's docs on JSNI: https://developers.google.com/web-toolkit/doc/latest/DevGuideCodingBasicsJSNI

answered Apr 7, 2012 at 2:58

Travis Webb

15k9 gold badges59 silver badges111 bronze badges

Sign up to request clarification or add additional context in comments.

5 Comments

user1226162 Over a year ago

try your way , its giving me this exception : javascriptexception:object doesnt support property or method 'testjavascript'

user1226162 Over a year ago

i was wondering , how does it know that my testjavascript is in helloJava.html

Travis Webb Over a year ago

Is helloJava.html the page from which you're launching your GWT app? If not, it needs to be. Or you need to put this code in a separate .js file which you include in your main html page.

user1226162 Over a year ago

yes it is, i have also updated my question with .html file , in case i am doing some thing wrong there , thanks

Travis Webb Over a year ago

It looks fine. I can't see everything you're doing so I don't know. Read the JSNI docs and learn about how it works, then you'll be able to debug it yourself.

BenMorel · Accepted Answer · 2014-01-30 09:40:47Z

0

The function syntax from Travis is correct, the problem is the name of the calling function and JS script is not right.

Here are the corrections

Error in the function declaration, you should not use var for the argument.
Remove the first row window.jsniAlert();
Correct the declaration of the second function function callJava(){ to function callJava(){

Here is the code (lets call the function in JS testJSnative):

<script type="text/javascript">
function testJSnative(input){
    //window.jsniAlert();
    var var1inJS = "Default value";

    alert("Value of Var1 = " + var1inJS);
    var1inJS = input;
    alert("Value of Var1 = " + var1inJS);

    var var2inJS = "What is the value of Var2";

    alert("Value of Var2 = " + var2inJS);

}

function callJava(){

}
</script>

Example of class implementing EntryPoint:

  public void onModuleLoad() {

    Button jsniButton = new Button("call JS");
    jsniButton.addClickHandler(new ClickHandler() {

      @Override
      public void onClick(ClickEvent event) {

        callJavascript();
      }
    });
    RootPanel.get().add(jsniButton);
  } 

  public native void callJavascript() /*-{
    $wnd.testJSnative("hello");
  }-*/;

I hope this will be helpful.

edited Jan 30, 2014 at 9:40

BenMorel

37k52 gold badges208 silver badges339 bronze badges

answered Apr 7, 2012 at 13:16

Goran Nastov

9851 gold badge10 silver badges18 bronze badges

2 Comments

user1226162 Over a year ago

thank you , my other method callJava () , i want to call a java class from this method , any sugestion for this

Goran Nastov Over a year ago

@user1226162 You're welcome. Find out more about GWT JSNI here: developers.google.com/web-toolkit/doc/latest/…

Collectives™ on Stack Overflow

how can i access some javaScript file from java in GWT

2 Answers 2

5 Comments

2 Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

5 Comments

2 Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related