Search in sources :

Example 36 with FormLayout

use of com.vaadin.flow.component.formlayout.FormLayout in project DoodleVerse by davidemarcoli.

the class CompanyManagementView method createEditor.

/**
 * Create the Company CRUD-Editor
 * @return the created Crud-Editor
 */
private CrudEditor<Company> createEditor() {
    TextField companyName = new TextField("Company");
    FormLayout form = new FormLayout(companyName);
    form.setMaxWidth("480px");
    form.setResponsiveSteps(new FormLayout.ResponsiveStep("0", 1), new FormLayout.ResponsiveStep("30em", 2));
    Binder<Company> binder = new Binder<>(Company.class);
    binder.forField(companyName).asRequired().bind(Company::getCompanyName, Company::setCompanyName);
    return new BinderCrudEditor<>(binder, form);
}
Also used : FormLayout(com.vaadin.flow.component.formlayout.FormLayout) Binder(com.vaadin.flow.data.binder.Binder) Company(com.dala.data.company.Company) TextField(com.vaadin.flow.component.textfield.TextField) BinderCrudEditor(com.vaadin.flow.component.crud.BinderCrudEditor)

Example 37 with FormLayout

use of com.vaadin.flow.component.formlayout.FormLayout in project furms by unity-idm.

the class DashboardResourceAllocateFormView method addForm.

private void addForm(DefaultNameField nameField) {
    final FormLayout formLayout = new FurmsFormLayout();
    final Label availableAmountLabel = new Label();
    formLayout.addFormItem(nameField, getTranslation("view.fenix-admin.resource-credits-allocation.form.field.name"));
    formLayout.addFormItem(siteField(), getTranslation("view.fenix-admin.resource-credits-allocation.form.field.site"));
    formLayout.addFormItem(communityField(), getTranslation("view.fenix-admin.resource-credits-allocation.form.field.community"));
    formLayout.addFormItem(resourceTypeField(), getTranslation("view.fenix-admin.resource-credits-allocation.form.field.resource_type"));
    formLayout.addFormItem(resourceCreditField(availableAmountLabel), getTranslation("view.fenix-admin.resource-credits-allocation.form.field.resource_credit"));
    formLayout.addFormItem(amountField(), getTranslation("view.fenix-admin.resource-credits-allocation.form.field.amount"));
    formLayout.addFormItem(availableAmountLabel, "");
    getContent().add(formLayout);
}
Also used : FurmsFormLayout(io.imunity.furms.ui.components.FurmsFormLayout) FormLayout(com.vaadin.flow.component.formlayout.FormLayout) FurmsFormLayout(io.imunity.furms.ui.components.FurmsFormLayout) Label(com.vaadin.flow.component.html.Label)

Example 38 with FormLayout

use of com.vaadin.flow.component.formlayout.FormLayout in project furms by unity-idm.

the class SettingsView method addForm.

private void addForm(SiteSettingsDto dto) {
    FormLayout formLayout = new FurmsFormLayout();
    Binder<SiteSettingsDto> binder = new Binder<>(SiteSettingsDto.class);
    binder.setBean(dto);
    formLayout.add(furmsIdRow(binder.getBean().getId(), getTranslation("view.site-admin.settings.form.furms-id")));
    formLayout.addFormItem(externalIdRow(binder), getTranslation("view.site-admin.settings.form.external-id"));
    formLayout.addFormItem(nameRow(binder), getTranslation("view.site-admin.settings.form.name"));
    formLayout.addFormItem(oauthClientIdRow(binder), getTranslation("view.site-admin.settings.form.oauth-client"));
    formLayout.addFormItem(connectionInfoRow(binder), getTranslation("view.site-admin.settings.form.info"));
    formLayout.addFormItem(sshKeyFromMandatory(binder), "");
    formLayout.addFormItem(prohibitOldSSHKey(binder), "");
    formLayout.addFormItem(uploadRow(binder), getTranslation("view.site-admin.settings.form.logo"));
    formLayout.addFormItem(policyRow(binder), getTranslation("view.site-admin.settings.form.policy"));
    formLayout.add(buttonsRow(binder));
    getContent().add(formLayout);
}
Also used : FurmsFormLayout(io.imunity.furms.ui.components.FurmsFormLayout) FormLayout(com.vaadin.flow.component.formlayout.FormLayout) Binder(com.vaadin.flow.data.binder.Binder) FurmsFormLayout(io.imunity.furms.ui.components.FurmsFormLayout)

Example 39 with FormLayout

use of com.vaadin.flow.component.formlayout.FormLayout in project flow-components by vaadin.

the class FormLayoutView method createLayoutHandleColspans.

private void createLayoutHandleColspans() {
    FormLayout columnLayout = new FormLayout();
    // Setting the desired responsive steps for the columns in the layout
    columnLayout.setResponsiveSteps(new ResponsiveStep("25em", 1), new ResponsiveStep("32em", 2), new ResponsiveStep("40em", 3));
    TextField firstName = new TextField();
    firstName.setPlaceholder("First Name");
    TextField lastName = new TextField();
    lastName.setPlaceholder("Last Name");
    TextField email = new TextField();
    email.setPlaceholder("Email");
    TextField nickname = new TextField();
    nickname.setPlaceholder("Username");
    TextField website = new TextField();
    website.setPlaceholder("Link to personal website");
    TextField description = new TextField();
    description.setPlaceholder("Enter a short description about yourself");
    columnLayout.add(firstName, lastName, nickname, email, website);
    // You can set the desired column span for the components individually.
    columnLayout.setColspan(website, 2);
    // Or just set it as you add them.
    columnLayout.add(description, 3);
    firstName.setId("colspan-first-name");
    lastName.setId("colspan-last-name");
    nickname.setId("colspan-nickname");
    email.setId("colspan-email");
    website.setId("colspan-website");
    description.setId("colspan-description");
    addCard("Handling columns and colspans in a layout", columnLayout);
}
Also used : FormLayout(com.vaadin.flow.component.formlayout.FormLayout) TextField(com.vaadin.flow.component.textfield.TextField) ResponsiveStep(com.vaadin.flow.component.formlayout.FormLayout.ResponsiveStep)

Example 40 with FormLayout

use of com.vaadin.flow.component.formlayout.FormLayout in project flow-components by vaadin.

the class FormLayoutView method createFormLayoutWithBinder.

private void createFormLayoutWithBinder() {
    FormLayout layoutWithBinder = new FormLayout();
    Binder<Contact> binder = new Binder<>();
    // The object that will be edited
    Contact contactBeingEdited = new Contact();
    // 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();
    NativeButton save = new NativeButton("Save");
    NativeButton reset = new NativeButton("Reset");
    layoutWithBinder.addFormItem(firstName, "First name");
    layoutWithBinder.addFormItem(lastName, "Last name");
    layoutWithBinder.addFormItem(birthDate, "Birthdate");
    layoutWithBinder.addFormItem(email, "E-mail");
    FormItem phoneItem = layoutWithBinder.addFormItem(phone, "Phone");
    phoneItem.add(doNotCall);
    // Button bar
    HorizontalLayout actions = new HorizontalLayout();
    actions.add(save, reset);
    save.getStyle().set("marginRight", "10px");
    SerializablePredicate<String> phoneOrEmailPredicate = value -> !phone.getValue().trim().isEmpty() || !email.getValue().trim().isEmpty();
    // E-mail and phone have specific validators
    Binding<Contact, String> emailBinding = binder.forField(email).withValidator(phoneOrEmailPredicate, "Both phone and email cannot be empty").withValidator(new EmailValidator("Incorrect email address")).bind(Contact::getEmail, Contact::setEmail);
    Binding<Contact, String> phoneBinding = binder.forField(phone).withValidator(phoneOrEmailPredicate, "Both phone and email cannot be empty").bind(Contact::getPhone, Contact::setPhone);
    // Trigger cross-field validation when the other field is changed
    email.addValueChangeListener(event -> phoneBinding.validate());
    phone.addValueChangeListener(event -> emailBinding.validate());
    // First name and last name are required fields
    firstName.setRequiredIndicatorVisible(true);
    lastName.setRequiredIndicatorVisible(true);
    binder.forField(firstName).withValidator(new StringLengthValidator("Please add the first name", 1, null)).bind(Contact::getFirstName, Contact::setFirstName);
    binder.forField(lastName).withValidator(new StringLengthValidator("Please add the last name", 1, null)).bind(Contact::getLastName, Contact::setLastName);
    // Birthdate and doNotCall don't need any special validators
    binder.bind(doNotCall, Contact::isDoNotCall, Contact::setDoNotCall);
    binder.bind(birthDate, Contact::getBirthDate, Contact::setBirthDate);
    // Click listeners for the buttons
    save.addClickListener(event -> {
        if (binder.writeBeanIfValid(contactBeingEdited)) {
            infoLabel.setText("Saved bean values: " + contactBeingEdited);
        } else {
            BinderValidationStatus<Contact> validate = binder.validate();
            String errorText = validate.getFieldValidationStatuses().stream().filter(BindingValidationStatus::isError).map(BindingValidationStatus::getMessage).map(Optional::get).distinct().collect(Collectors.joining(", "));
            infoLabel.setText("There are errors: " + errorText);
        }
    });
    reset.addClickListener(event -> {
        // clear fields by setting null
        binder.readBean(null);
        infoLabel.setText("");
        doNotCall.setValue(false);
    });
    infoLabel.setId("binder-info");
    firstName.setId("binder-first-name");
    lastName.setId("binder-last-name");
    phone.setId("binder-phone");
    email.setId("binder-email");
    birthDate.setId("binder-birth-date");
    doNotCall.setId("binder-do-not-call");
    save.setId("binder-save");
    reset.setId("binder-reset");
    addCard("A form layout with fields using Binder", layoutWithBinder, actions, infoLabel);
}
Also used : FormLayout(com.vaadin.flow.component.formlayout.FormLayout) BinderValidationStatus(com.vaadin.flow.data.binder.BinderValidationStatus) Component(com.vaadin.flow.component.Component) Composite(com.vaadin.flow.component.Composite) EmailValidator(com.vaadin.flow.data.validator.EmailValidator) Binder(com.vaadin.flow.data.binder.Binder) HorizontalLayout(com.vaadin.flow.component.orderedlayout.HorizontalLayout) Div(com.vaadin.flow.component.html.Div) Label(com.vaadin.flow.component.html.Label) NativeButton(com.vaadin.flow.component.html.NativeButton) ResponsiveStep(com.vaadin.flow.component.formlayout.FormLayout.ResponsiveStep) FormItem(com.vaadin.flow.component.formlayout.FormLayout.FormItem) Route(com.vaadin.flow.router.Route) BindingValidationStatus(com.vaadin.flow.data.binder.BindingValidationStatus) SerializablePredicate(com.vaadin.flow.function.SerializablePredicate) TextField(com.vaadin.flow.component.textfield.TextField) ValueChangeMode(com.vaadin.flow.data.value.ValueChangeMode) VerticalLayout(com.vaadin.flow.component.orderedlayout.VerticalLayout) H2(com.vaadin.flow.component.html.H2) Collectors(java.util.stream.Collectors) Serializable(java.io.Serializable) FormLayout(com.vaadin.flow.component.formlayout.FormLayout) Checkbox(com.vaadin.flow.component.checkbox.Checkbox) StringLengthValidator(com.vaadin.flow.data.validator.StringLengthValidator) DatePicker(com.vaadin.flow.component.datepicker.DatePicker) LocalDate(java.time.LocalDate) Optional(java.util.Optional) Binding(com.vaadin.flow.data.binder.Binder.Binding) NativeButton(com.vaadin.flow.component.html.NativeButton) EmailValidator(com.vaadin.flow.data.validator.EmailValidator) Optional(java.util.Optional) FormItem(com.vaadin.flow.component.formlayout.FormLayout.FormItem) StringLengthValidator(com.vaadin.flow.data.validator.StringLengthValidator) Label(com.vaadin.flow.component.html.Label) BindingValidationStatus(com.vaadin.flow.data.binder.BindingValidationStatus) HorizontalLayout(com.vaadin.flow.component.orderedlayout.HorizontalLayout) Binder(com.vaadin.flow.data.binder.Binder) Checkbox(com.vaadin.flow.component.checkbox.Checkbox) TextField(com.vaadin.flow.component.textfield.TextField) DatePicker(com.vaadin.flow.component.datepicker.DatePicker)

Aggregations

FormLayout (com.vaadin.flow.component.formlayout.FormLayout)47 TextField (com.vaadin.flow.component.textfield.TextField)28 Binder (com.vaadin.flow.data.binder.Binder)21 BinderCrudEditor (com.vaadin.flow.component.crud.BinderCrudEditor)15 Person (com.vaadin.demo.domain.Person)12 EmailField (com.vaadin.flow.component.textfield.EmailField)10 Div (com.vaadin.flow.component.html.Div)8 ResponsiveStep (com.vaadin.flow.component.formlayout.FormLayout.ResponsiveStep)6 FormItem (com.vaadin.flow.component.formlayout.FormLayout.FormItem)4 Label (com.vaadin.flow.component.html.Label)4 NumberField (com.vaadin.flow.component.textfield.NumberField)4 TextArea (com.vaadin.flow.component.textfield.TextArea)4 StringLengthValidator (com.vaadin.flow.data.validator.StringLengthValidator)4 FurmsFormLayout (io.imunity.furms.ui.components.FurmsFormLayout)4 Test (org.junit.Test)4 ValueChangeEvent (com.vaadin.flow.component.HasValue.ValueChangeEvent)3 Checkbox (com.vaadin.flow.component.checkbox.Checkbox)3 ComboBox (com.vaadin.flow.component.combobox.ComboBox)3 RichTextEditor (com.vaadin.flow.component.richtexteditor.RichTextEditor)3 EAGER (com.vaadin.flow.data.value.ValueChangeMode.EAGER)3