Migration to GXT 2.0 from GXT 1.2.4

 

EXTJS released GXT 2.0 on July 6 2009.

GXT 2.0 uses GWT version of 1.6 and above. The project structure has been changed by using the WAR folder for all the configuration and public resource files. An eclipse plug-in  has been released at Google code which creates the project based on our required project structure, with the server configurations and WAR folder created for our convenience.

Coming to GXT there are a lot breaking changes in 2.0 and can be found under migration guide of your downloaded zip. some of the basic changes includes, variables that are accessed as such previously are changed to getter and setter methods, more events are added such as ButtonEvent, MessageBoxEvent etc, and also the ext-all.css that was used previously has been changed to gxt-all.css and has been placed under resources/css along with all the other images( this folder is also present within the downloaded zip).

Creating a project:

1) The eclipse plugin allows us to create a New Web Application Project that includes creating a new GWT module.

2) Copy resources/ folder from GXT into the WAR folder that was created by the wizard.

3) Add  <link rel="stylesheet" type="text/css" href="resources/css/gxt-all.css" /> to the HTML file that is also created in the WAR folder of the application.

4) The compiled code is also placed in the WAR folder

Disable the Browser’s context menu

The following lines of native JavaScript code can be used to disable the browsers context menu, when it is no more needed or if there is a user defined context menu. This method has to be called by the component that needs to have the menu disabled.

private static native void disableBrowserContextMenuJSNI() /*-{ 
         $doc.oncontextmenu = function() { return false; }; 
     }-*/; 

Error Messages gxt

Its been quite a while since i made a blog post. I have been working on generating a couple of reports for my application and generating those took forever. Now here i am finally done with my application and adding a few modifications to make it look good.

I was trying to get a TextField’s regex with the first character being a number. This post is mainly to change the error message we get with the little red exclamation mark beside the text field.

shiftNo.setRegex("[0-9][[0-9][a-z][A-Z]]*");
shiftNo.getMessages().setRegexText("shift number should always start with a number");