EnhancedFormLayout

A from layout component with a FormItem that has functioning as required indication inherited from the wrapped component.

View larger

Close

FormItem in the standard Vaadin FormLayout loses the required indicator of the field component. This component is and extended version of FormLayout with version of FormItem, EnhancedFormItem that solves this problem by inherting the required indicator of the wrapped component to the EnhancedFormItem itself.

See more: https://github.com/vaadin/vaadin-form-layout/issues/122

Fixed also issues with getResponsiveSteps().

See more: https://github.com/vaadin/vaadin-form-layout/issues/135

Adds methods to modify label aferwards.

EnhancedFormItem#setLabel(String)

EnhancedFormItem#setLabel(Component)

Adds following convenience API to configure the layout parameters more easily:

EnhancedFormLayout#setFormItemLabelWidth(String)

EnhancedFormLayout#setFormItemRowSpacing(String)

EnhancedFormLayout#setColSpacing(String)

EnhancedFormItem#setLabelWidth(String)

EnhancedFormItem#setRowSpacing(String)

EnhancedFormItem#setRightAlinged(boolean) - Make label right aligned

EnhancedFormItem#setBottomAligned(boolean) - Make the form item bottom aligned

Sponsored development

Major pieces of development of this add-on has been sponsored by multiple customers of Vaadin. Read more about Expert on Demand at: Support and Pricing

Sample code

        EnhancedFormLayout layoutWithBinder = new EnhancedFormLayout();
        Binder<Contact> binder = new Binder<>();

        // Create the fields
        TextField firstName = new TextField();
        firstName.setValueChangeMode(ValueChangeMode.EAGER);
        TextField lastName = new TextField();
        lastName.setValueChangeMode(ValueChangeMode.EAGER);
        TextField phone = new TextField();
        phone.setValueChangeMode(ValueChangeMode.EAGER);
        TextField email = new TextField();
        email.setValueChangeMode(ValueChangeMode.EAGER);
        DatePicker birthDate = new DatePicker();
        Checkbox doNotCall = new Checkbox("Do not call");
        Label infoLabel = new Label();
        Button save = new Button("Save");
        save.addThemeVariants(ButtonVariant.LUMO_PRIMARY);
        Button reset = new Button("Reset");

        // Wrap with form items
        layoutWithBinder.addFormItem(firstName, "First name");
        layoutWithBinder.addFormItem(lastName, "Last name");
        layoutWithBinder.addFormItem(birthDate, "Birthdate");
        layoutWithBinder.addFormItem(email, "E-mail");
        EnhancedFormItem phoneItem = layoutWithBinder.addFormItem(phone, "Fone");
        phoneItem.setLabel(new Label("Phone"));
        phoneItem.add(doNotCall);

        // Add the binder code
       ...

Links

• View on GitHub
• Edit

Compatibility