Calling functions from .js file from GWT

Question

I have a page slider type widget from a third party that is pretty standard in that it runs some jquery code (inside an init function provided by the widget) on the HTML in your document looking for the classes of interest.

My issue is that I am using GWT so my HTML is being generated and then inserted in to the page by the GWT javascript file. The HTML being inserted has all the proper tags for the slider widget to work. So after it is added (to the DOM) I need to run the init js code so that the slider works as expected. I created a JSNI to make the call:

private native void initSlider() /*-{

      Index.initLayerSlider();

}-*/;

I load Index in the head of the HTML file before the nocache.js GWT file, but I get the javascript console error when I load the site: Uncaught ReferenceError: Index is not defined so I tried

private native void initSlider() /*-{
   jQuery(document).ready(function() {
      Index.initLayerSlider();
   });
}-*/;

and jQuery is also loaded in the head of my HTML file but I get the similar error: Uncaught ReferenceError: jQuery is not defined

How can I call this function from an external .js file from GWT? I guess I need to do something to make sure the browser has loaded and ran the .js file before GWT runs, or have GWT pause when it gets there until the .js file has been loaded. Or maybe I should approach this problem differently?

I would prefer to not have to make any modifications to the third party widget, but would be willing to make small ones if needed/possible. It has been obfuscated so it is very difficult to read.

Answer 1

call javascript from GWT need start with $wnd

see detail http://www.gwtproject.org/doc/latest/DevGuideCodingBasicsJSNI.html

private native void initSlider() /*-{
  $wnd.Index.initLayerSlider();
}-*/;