Workin' forms

[Michi_de]

Hi!
Im totaly new to Ext GWT. I worked little with GWT (its realy great) and now i have to use Ext GWT. Im sure Ext GWT is even better as the simple GWT. But so far i have some problems.
I create a formpanel, just like the the example:


FormPanel simple = new FormPanel();
TextField<String> firstName = new TextField<String>();
firstName.setFieldLabel("Name");
simple.add(firstName);
simple.addButton(new Button("Save"));

So far so nice. Its just a snipplet of my code. When im running this "application" i get what i want to see: a small form with a button.

But my problem is: how to work with this form? How can i wire the "Save" button with some ActionListener in order, to start a method or sthg?
For example:
when i click the save button, a method should apply all the fields data into a class. This class i want to send via rpc to a servlet in order to save the data into a database.
Its so easy in GWT. You just have to add the .addClickListener to the button. Start the method etc.
In Ext GWT i just cant do anything :(

Do any of you have example code for something like this?

[timefortea]

Here's an example of a "Login" form I created:



loginForm = new FormPanel();

nameField = new TextField<String>();
nameField.setFieldLabel(Constants.STR_USERNAME);
nameField.setAllowBlank(false);
loginForm.add(nameField);

passField = new TextField<String>();
passField.setFieldLabel(Constants.STR_PASSWORD);
passField.setPassword(true);
passField.setAllowBlank(false);
loginForm.add(passField);

loginForm.setButtonAlign(HorizontalAlignment.CENTER);
Button loginButton = new Button(Constants.STR_LOGIN);
loginButton.addListener(Events.Select, new SelectionListener<ComponentEvent>( ){
public void componentSelected(ComponentEvent be) {
authenticate();
}
});
loginForm.addButton(loginButton);


And the authenticate method grabs the values from the form like so (note that I have kept references to the individual fields to make it easy to retrieve the values):




String loginName = nameField.getValue();
String password = passField.getValue();



Hope this helps.

[Michi_de]

Thanks so far!
I 've got some questions related to your code:


loginButton.addListener(Events.Select, new SelectionListener<ComponentEvent>( ){
public void componentSelected(ComponentEvent be) {
authenticate();
}
});

What actually is "Events.Select" ? As the API tells me, the value is gona be "640" , a integer. Is this just standard, to put "Events.Select" when the .addListener() is askin for an int value?

And what is "ComponentEvent be" ? Is this another "just use it"-standard? ^^

And when it comes to my "authenticate()" method, i encounter some problems. This method is outside of "onModuleLoad()". So my form variables like "nameField" are just know there. Should i just instantiate them outside the "onModuleLoad()" ? So i can use them in my other methods too?

[villemustonen]

Hello,

Here is how I understand this.

Events.Select is the event that is fired when the component is selected (ie. button clicked). Components also fire other events, check the API for those.

ComponentEvent be is the object-model for the event that fired, and contains information about the actual event, and the events source. For example, you could have the same listener for several buttons, and the be.component returns the actual component that was clicked/selected etc.

I usually introduce fields and other UI items in the class, and instantiate them in methods, so they are known in all methods.

[timefortea]

That's about the limit of my understanding of the events model. The Javadocs contain information on what events can be fired from some widgets. I'm not entirely sure about what listener object should be created when, though - I don't know if there is a mapping with the Events type that is specified?

As villemustonen has said, create your object references in the class, so that you can reference them when the listener is called.