0

I have a form fields binded to java entity model. That model has an annotation:

@ValidPassword
private String password

which validates the field with some conditions and return error message containing each failed condition separated by '\n' new line sign.

Vaadin form is connected to this model with:

    username =  new TextField("Username");
    username.addClassName("username-field");
    password =  new PasswordField("Password");
    password.addClassName("password-field");
    binder.forField(username ).asRequired().bind("username");
    binder.forField(password).asRequired().bind("password");

Writting input to password field results in: image-link When I want each failed condition to start on a new line.

stackproblem
  • 1
  • 1

1 Answers1

0

If you want to use JSR-303 Bean validation with Vaadin 8 or like Vaadin 14 and newer, then you need to use BeanValidationBinder instead of regular Binder. Also in that case you are not supposed to build bindings using

binder.forField(password).asRequired().bind("password");

But instead just use

binder.bindInstanceFields(form);

Furthermore, if you need to customize how error is being displayed, you can use for example ValidationStatusHandler, which is called each time validation status changes from valid to invalid or vica versa. By default the error is shown inlined in component. You can define your own component, e.g. Html, where you can use rich formatting.

    binder.forField(field).withValidationStatusHandler(handler -> {
        if (handler.isError()) {
            handler.getMessage().ifPresent(error -> {
                Html html = new Html("<span>"+error+"</span>");
                layout.add(html);
            });
        }
    }).bind("property");
Tatu Lund
  • 9,949
  • 1
  • 12
  • 26
  • I use `BeanValidationBinder`. I changed the way of binding to `binder.bindInstanceFields(form);` but the message format is still the same. I have message from Passay validator joined by '\n' but it doesn't create new lines in the view. How to achive that? – stackproblem Feb 08 '21 at 21:15
  • Ok, thanks for clarification, I added that part to the answer. – Tatu Lund Feb 09 '21 at 06:07
  • Yes, that is some kind of workaround, thank you. Is there a way to insert that message to `
    ` in password component or manipulate it directly there to show formatted text in place like in the attached image?
     – stackproblem Feb 09 '21 at 13:51