Getting Started with GWT-Ext 0.9

A guide to using GWT-Ext in your GWT application. You must be familiar with the basics of how GWT works. If you're new to GWT, please read the GWT Getting Started Guide first.

Details

Download the latest GWT-Ext jar file. Add it you your classpath just like you normally add the gwt-user.jar file in your classpath for compiling and running your app.

Add the line

<inherits name='com.gwtext.GwtExt'/>

to your GWT application module file.

Download the appropriate version of Ext from here. Check the release notes of GWT-Ext for the supported version of Ext. You will need to include the relevant Ext Javascript and resources (like CSS and images) under the "public" directory of your GWT application. Ext comes with a build tool that allows you to select the components that you're using in your app and will custom build a single compressed Javascript file with only the relevant code. However I would suggest you start off with including the entire Ext Javascript and resources in your "public" directory and once you get everything working and ready to deploy you can worry about minifying Ext to only the required Javascript and CSS. You do this by copying ext-all.js and the entire resources and adapter directories from the Ext distribution into a directory under your "public" directory. For example copy the files to /main/src/com/foo/public/js/ext/

You now need to include the Ext Javascript files and CSS in your applicaitons GWT host page (like /main/src/com/foo/client/public/MyApp.html).

<html>
<head>
    <title>My App</title>
    <meta name='gwt:module' content='com.foo.MyApp'>
    <link rel=stylesheet href="MyApp.css">

    <link rel="stylesheet" type="text/css" href="js/ext/resources/css/ext-all.css"/>
    <link rel="stylesheet" type="text/css" href="js/ext/resources/css/xtheme-aero.css" />

    <script type="text/javascript" src="js/ext/adapter/yui/yui-utilities.js"></script>
    <script type="text/javascript" src="js/ext/adapter/yui/ext-yui-adapter.js"></script>
    <script type="text/javascript" src="js/ext/ext-all.js"></script>

</head>
<body class="xtheme-aero">
<script language="javascript" src="gwt.js"></script>
<iframe id="__gwt_historyFrame" style="width:0;height:0;border:0"></iframe>

</body>
</html>

As I mentioned earlier, I would suggest that you include the full version of Ext's Javascript file ext-all.js and CSS file ext-all.css during developement. Once you get started and are familiar with how things work, you can look into selectively including only the required Ext Javascript and CSS files.

Thats it, you should now be able to build and run you app that uses GWT-Ext API's. Take a look at the code of the samples that are available in the GWT-Ext bundle.

Comment by matias.g.rodriguez, Jul 20, 2007

Hi. There is no 1.1 Beta 2 on http://extjs.com/download. Is ext-1.1-rc1.zip supported?

Regards Matías Rodriguez

Comment by collinssg, Jul 22, 2007

It's still available, just not linked. Try: http://extjs.com/deploy/ext-1.1-beta2.zip

Comment by rajiv.jivan, Jul 23, 2007

The code in SVN works with 1.1 RC1.

Comment by matias.g.rodriguez, Jul 23, 2007

Thanks!

Comment by shie.erlich, Aug 02, 2007

downloaded the 0.91 zip file, few times, but all i get is a corrupt zip file. anyone else seeing this?

shie

Comment by asgillett, Aug 02, 2007

The zip file is fine. Must be a problem at your end.

Comment by ampaiva, Aug 10, 2007

Try to use the gwt-1.4.10

Comment by sanjiv.jivan, Aug 14, 2007

This is not a place for discussions. Please post your questions on the GWT forum : http://groups.google.com/group/gwt-ext

Thanks.

Comment by joti.mail, Oct 29, 2007

GWTExt rocks, if you're using Linux put an eye on the thread given below as it keeps an important trick to get it running if you only get a white page. -> Put all the scripts and the js in the .gwt.xml not in the .html.

See here http://groups.google.com/group/gwt-ext/browse_thread/thread/622c4208d9d90cf5

Comment by stefan.minchev, Nov 12, 2007

This is a fantastic library guys! Great work!

Comment by njuneja, Nov 30, 2007

Excellent Toolkit. Why did I not get this earlier

Comment by ducharmepatrick, Jan 24, 2008

Any news on ext 2.0 integration?

Comment by trapongx, Jan 28, 2008

Great library. But require documentation. However, documentation of ExtJS can help but not up to date, such as some deprecated method didn't tell how user should handle it.

Comment by renzo.stanley, Jan 31, 2008

Hi,

Extjs on GWT is amazing!!

Thanks :D Regards

Comment by gmhodges, Feb 03, 2008

Looks great! Just need 2.x support now. What are the plans to do so?

Comment by sanjiv.jivan, Feb 07, 2008

GWT-Ext 2.0 with Ext 2.0 support has been released. Go to http://www.gwt-ext.com/ for details.