gwt - 使用 Google Web Toolkit 进行表单验证？

Question

我是 GWT 新手。表单验证有哪些好的解决方案？如果可能的话，我想避免自己动手。

Answer 1

在我的 GWT 应用程序中，我总是使用自定义验证器类。我创建了自己的文本框类，它扩展了 gwt 文本框。我调用 CustomTextBox 而不是 gwt 的文本框。

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();
}

示例电子邮件验证器

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;
 }
}

我的验证错误如下所示

如果您喜欢这种方法，您可以遵循此方法。这里的问题是我们不直接在 UI 中显示错误消息。仅在工具提示中我们显示。