When I call addStyleName(“invalid”) from the validate(Object value) method in my Validator the invalid style is only added to my input tag the second time the validation failed.
textField = new TextField();
textField.setNullRepresentation("");
Validator titleFieldValidator = new MyRegexpValidator("^ *[^ ]
.{4,}$") {
public void validate(Object value) throws InvalidValueException {
if (!isValid(value)) {
textField.addStyleName("invalid");
System.err.println("invalid");
} else {
textField.removeStyleName("invalid");
System.err.println("valid");
}
}
};
textField.addValidator(titleFieldValidator);
textField.setImmediate(true);
mainWindow.addComponent(textField);
When I enter “12” in the TextField I see “invalid” in the console, but the invalid style is not added to the input tag. When I enter “1” (or another invalid entry) afterwards the invalid tag is set! The same applies when entering valid input, only the second time the invalid style is been removed.
To test I made a button which sets the invalid style when clicking. This works from the first time.
Button button = new Button("Login");
button.addListener(new ClickListener() {
public void buttonClick(ClickEvent event) {
textField.addStyleName("invalid");
}
});
mainWindow.addComponent(button);
Is this expected behavior, or a bug? When I use the standard validationError framework I get the red icon and text message immediately upon validation, but I want some custom things to happen (so part of the answer could be: can I implement my own validation callback handler).
Note that e.g. TextField automatically adds the “error” style when validation fails (validate() throws an exception), so you could use “v-textfield-error” to do what your example did.
Validators are called late in the render phase of a component, so currently any direct UI updates made in the validation methods might not be effective for the component immediately but only on the next repaint. If a validation exception is thrown, its message (and “failed” state) is communicated to the UI immediately.
One option would be to add a blur listener that explicitly performs the validation - it would be executed earlier and therefore could perform other UI updates.
Thanks for the response. I’ll check if I can use error style when validation fails, but I believe last time I could not get it working. It was either the exclamation mark icon (with error style) or no added style at all.
If the error style does not work I’ll try the blurlistener to do the validation.