Simulated onChange event for TextField

[harlequin516]

Can anyone please post an example of how to capture a value change in a text field. I have read through many posts (mostly js not gxt) about this, but I am still confused.

Is there an obvious flaw in my attempt here?



final TextField<String> tf = new TextField<String>() {
{
setFieldLabel("Username");
setEmptyText("Choose a Username");
setAllowBlank(false);
setMinLength(6);
super.setValue(p.getMyUsername());
addListener(Events.Blur, new Listener<FieldEvent>() {
public void handleEvent(FieldEvent fe) {
new FieldEventProcessor(fe) {
public void onChange(FieldEvent fe) {
p.setMyUsername((String)value);
saveProfile(p, new AsyncCallback<Profile>() {
FieldMessages fms = new FieldMessages();
public void onSuccess(Profile result) {
fms.setInvalidText("Saved OK");
setMessages(fms);
//clearAfterDelay(tf);
}
public void onFailure(Throwable caught) {
fms.setInvalidText("That username is not available.");
setMessages(fms);
}
});
}
};
}
});
}
};


What is the error of my ways?

-Sham

[darrellmeyer]

You should listen for Events.Change not Events.Blur.

[harlequin516]

I think the event model is not obvious. I did not initially realize that addListener was required for listening for "change" FieldEvent s. I was originally overriding onComponentEvent, but the change event never occured.

I think the Showcase should have an formfield event handling section.

[gslender]

The use of addListener is a common Java model (in Swing and SWT) for handling events - it is also broadly used across other UI development models too... (ie .Net/C# etc)

[harlequin516]

The API Docs for Field<D> shows the overridden function:


void onComponentEvent (file:///c:/Users/Sham/Documents/Archives/Development/VitrualCruising.com/sources/unzipped/gxt-1.0-rc2/docs/api/com/extjs/gxt/ui/client/widget/form/Field.html#onComponentEvent%28com.extjs.gxt.ui.client.event.ComponentEvent%29)(ComponentEvent (file:///c:/Users/Sham/Documents/Archives/Development/VitrualCruising.com/sources/unzipped/gxt-1.0-rc2/docs/api/com/extjs/gxt/ui/client/event/ComponentEvent.html) ce)
Any events a component receives will be forwarded to this method.

but, does not make special mention in the Events section that the Component.addListener(int, Listener) is required to handle Field events.

Elsewhere in the forums it stated that you could override onComponentEvent to capture the Field events. I am not quite sure. It didn't work for me, but shouldn't this work as well?

It appears that addListener registers for notification of Field events. Is this the case?