Skip to content

Update Flow Binder article to address recent changes #4067

@vursen

Description

@vursen

The Flow Binder article is quite outdated and includes examples that are nowadays incorrect. For example, it suggests adding an error message to EmailField using EmailValidator, whereas the correct approach is to use i18n instead. I propose reorganizing the article to start by explaining the default behavior and then gradually moving to more advanced customization options.

1. Component constraint validation and i18n error messages (default validator)

Begin by introducing the default behavior of component constraints and how i18n is used for configuring error messages:

EmailField emailField = new EmailField();
emailField.setI18n(new EmailFieldI18n()
    .setPatternErrorMessage("This doesn't look like a valid email address"));

binder.forField(emailField).bind(Person::getEmail, Person::setEmail);

It might also be helpful to include an admonition explaining the difference with Vaadin 23 and mentioning that the previous behavior can be restored by disabling the default validator. Or, alternatively, the Vaadin 24 upgrading guide could be updated to cover this detail:

EmailField emailField = new EmailField();
+ emailField.setI18n(new EmailFieldI18n()
+    .setPatternErrorMessage("This doesn't look like a valid email address"));

binder.forField(emailField)
-    .withValidator(new EmailValidator(
-        "This doesn't look like a valid email address"))
    .bind(Person::getEmail, Person::setEmail);

2. Defining custom rules on top of constraint validation (custom validators)

Next, explain how developers can add custom validation rules in addition to the default constraint validation:

EmailField emailField = new EmailField();
emailField.setI18n(new EmailFieldI18n()
    .setPatternErrorMessage("This doesn't look like a valid email address")); // <---- defined using i18n

binder.forField(emailField)
    .asRequired("Field is required") // <---- defined on the Binder
    .withValidator(email - > email.endsWith("@acme.com"),
        "Only acme.com email addresses are allowed")
    .bind(Person::getEmail, Person::setEmail);

3. Opting out of default validator

Finally, explain how to disable the default constraint validation and define your own:

EmailField emailField = new EmailField();

binder.forField(emailField)
    .withDefaultValidator(false)
    .withValidator(new EmailValidator(
        "This doesn't look like a valid email address"))
    .withValidator(email - > email.endsWith("@acme.com"),
        "Only acme.com email addresses are allowed")
    .bind(Person::getEmail, Person::setEmail);

Metadata

Metadata

Assignees

No one assigned

    Projects

    Status

    🅿️Parking lot

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions