Using jquery plugins with Google Web Toolkit?

Question

Is it possible to use jquery plugins within google web toolkit?

There are a lot of excellent plugins available for various UI widgets, such as date/time pickers, searchable dropdowns, etc. In many cases these plugins also come with their own css styles. I'd like to be able to use these plugins and get their values in my gwt application.

well, theoretically, if you can add your own javascript and css, i don't know what would stop you from adding js/css from your favorite plugins while you're at it. — user400654
– user400654, Commented Jan 10, 2014 at 20:37

Chris Hinshaw · Accepted Answer · 2014-01-10 22:54:31Z

2

From experience you have two options.

You can use GwtQuery which is a gwt native version of much of jquery. For instance "$" is actually a static java class. There are also quite a few plugins and addons that have great support such as the GwtQuery-DND for drag and drop.

http://code.google.com/p/gwtquery/

http://code.google.com/p/gwtquery-plugins/

The other option is to role your own for specific examples. If you have a specific jquery plugin that you want and GwtQuery is not for you. You can use gwt jsni interface which essentially allows you to call native javascript using java native interface. There are quite a few plugins that work this way such as Gflot and gcodmirror (which is a native version of the wiki editor I am using now).

JSNI Documentation
http://www.gwtproject.org/doc/latest/DevGuideCodingBasicsJSNI.html

IMHO it is best to stick with GwtQuery as the jquery functions are almost verbatim usable in GwtQuery and you get the added performance boost of having the code compiled and optimized by the gwt compiler.

answered Jan 10, 2014 at 22:54

Chris Hinshaw

7,3352 gold badges43 silver badges70 bronze badges

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

4 Comments

Ali Over a year ago

Using JSNI, is it possible to interact with the plugin? E.g say I have a calendar plugin. If a particular date on the calendar is clicked, I want to have an event fired which will callback a particular java method of my GWT class. Is that possible to do via jsni?

Chris Hinshaw Over a year ago

Yes it's possible, jsni supports 2 way communication between js and gwt. Here is an example of how to pass a callback to your jquery function. stackoverflow.com/questions/3357076/…

Ali Over a year ago

That seems like only static methods can be called back?

Manolo Carrasco Moñino Over a year ago

You can use either static or class methods with jsni

Cataclysm · Accepted Answer · 2014-01-11 02:47:15Z

2

Yes .. you can use Javascript libs in GWT project. Simply import it's lib in your html file or GWT.xml. In your module.xml file as below..

<module rename-to='TestingProject'>
<inherits name='com.google.gwt.user.User'/>
<entry-point class='test.Gwt.testingSample.client.TestingProjectEntry'/>
<inherits name="com.google.gwt.user.theme.standard.Standard" />
<source path='client'/>
<source path='shared'/>
<script src="/js/jquery-1.10.min.js"></script>
</module>

And test in your HTML file..

<body>
<center>
    <div id= "start"></div>
</center>
<script type="text/javascript">
     $(document).ready(function(){
     $("div#start").html("<font color = 'green' font-weight = 'bold' size = '12'>
                          Hello World !</font>");
});
</script>
<body>

Have a useful for you... !

answered Jan 11, 2014 at 2:47

Cataclysm

8,85721 gold badges79 silver badges127 bronze badges

2 Comments

Ali Over a year ago

Thanks. This is useful, but a problem can occur when I want to manipulate any of these plugins from within my java code. For that purpose, JSNI would be needed.

Cataclysm Over a year ago

@ClickUpvote Yes you are right ! If you want to use any JS from your java class , you need to use JSNI.

Collectives™ on Stack Overflow

Using jquery plugins with Google Web Toolkit?

2 Answers 2

4 Comments

2 Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

4 Comments

2 Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related