I'm new to GWT. What good solutions exist for form validation? I'd like to avoid rolling my own if possible.
3 Answers
In my GWT applications I always use my custom validator classes. I have created my own textbox class which extends gwt textbox. And I call CustomTextBox instead of gwt's textbox.
CustomTextBox.java
public class CustomTextBox extends TextBox implements HasValidators{
private static final String TEXTBOX_VALIDATION_ERROR_STYLE = "error-text-box";
private String errorMessage = "";
private List<Validator> validators = new ArrayList<Validator>();
public CustomTextBox() {
}
public CustomTextBox(String name) {
setName(name);
}
public String getErrorMessage() {
return errorMessage;
}
public void setErrorMessage(String errorMessage) {
this.errorMessage = errorMessage;
}
public void addValidator(Validator validator) {
validators.add(validator);
}
public boolean validate() {
boolean validationResult = true;
for (Validator validator : validators) {
validationResult = validator.validate(getValue().trim());
if (!validationResult) {
errorMessage = validator.getErrorMessage();
break;
}
errorMessage = validator.getErrorMessage();
}
setErrorStyles(validationResult);
return validationResult;
}
private void setErrorStyles(boolean validationResult) {
if (validationResult) {
removeStyleName(TEXTBOX_VALIDATION_ERROR_STYLE);
setTitle("");
} else {
addStyleName(TEXTBOX_VALIDATION_ERROR_STYLE);
setTitle(errorMessage);
}
}
@Override
public void setValue(String s) {
removeStyleDependentName(TEXTBOX_VALIDATION_ERROR_STYLE);
super.setValue(s);
}
@Override
public String getValue() {
return super.getValue().trim();
}
}
Validator.java
public abstract class Validator {
public String errorMessage;
public abstract boolean validate(String value);
public abstract String getErrorMessage();
}
Sample Email validator
public class EmailValidator extends Validator {
public boolean validate(String value) {
if (value.matches("^[A-Za-z0-9._%+-]+@[A-Za-z0-9.-]+\\.[A-Za-z]{2,}$")) {
errorMessage = "";
return true;
} else {
errorMessage = "Enter valid email Id";
return false;
}
}
public String getErrorMessage() {
return errorMessage;
}
}
My validation error looks like following
If you like this approach you can follow this. The problem here is we don't display the error message directly in the UI. Only in tooltip we are showing.
-
That looks pretty straightforward. Is there no framework solution? May 29, 2011 at 7:55
-
good solutin. Can you share "HasValidators" interface and "TEXTBOX_VALIDATION_ERROR_STYLE" css style? Jan 30, 2012 at 16:26
-
I think "HasValidators" not needed. Css class is ".error-text-box { border: 1px solid red; background: white url("../images/icons/validation_error_icon.gif") no-repeat left center; padding-left: 15px !important; } ". You may want to download the error image. I will update this answer soon.– DonXJan 30, 2012 at 17:17
GXT and SmartGWT (both of them I'd highly advise against, for many reasons) have form validation.
GWT's Editor framework provides a mean to display javax.validation.ConstraintViolation
(you'd still have to do the actual display by implementing HasEditorErrors
to receive the errors for a given field; the Editor framework only dispatches the errors to the appropriate "fields") but nothing to validate on the client side.
The recently released, GWT 2.3 has preliminary support for JSR 303 Bean Validation on the client side but it's not yet finished: http://code.google.com/p/google-web-toolkit/wiki/BeanValidation I think GWT 2.4 will have full (or almost full) support.
Note that GWT's stake on validation is on validating the objects, not about validating the "form fields" editing an object's properties.
-
-
6SmartGWT is only a wrapper on SmartClient, so it doesn't benefit from any optimization done by the GWT compiler. GXT is so heavy-weight (bloated?) that the second thing you learn after "Hello World" is how to make a "loading, please wait" splash screen (this is from a book I was given for review). And neither of them integrates nicely with GWT "native" widgets (from what I read online). And I believe I could find many other reasons if I thought about it just a little bit. May 29, 2011 at 22:01
-
9If you can resist the temptation to use SmartGWT or GXT, you should resist it. SmartGWT and GXT showcases make their appearance very appealing, but when you want to perform MVP/MVC or even simple validation, their technological/protocol expectations do not coincide with GWT and gets very confusing. It is better to use plain GWT and dumb down the aesthetic expectation of your application and then gradually work on the CSS. Let your application work before working on the aesthetics. Don't let SmartGWT or GXT divert you from that mission. If it is good enuf for google, it is good enuf for you. Jun 2, 2011 at 2:30
We are currently using this project for forms validation: http://code.google.com/p/gwt-validation/
It's the source code that serves as the basis of the new GWT 2.4 Validation framework.
Chris Buffalo has been doing an amazing work on that project. Works out of the box for us.