vaadin / flow-components

Java counterpart of Vaadin Web Components
102 stars 65 forks source link

Add support for having labels #1129

Open mvysny opened 4 years ago

mvysny commented 4 years ago

Hi, please add support for having labels. This is very useful e.g. in forms. Both for ListBox and for MultiSelectListBox.

mvysny commented 4 years ago

listBox.getElement().setProperty("label", "foo") doesn't seem to work, so the only workaround is to wrap the ListBox in a CustomField.

ruizrube commented 4 years ago

That is a very common feature. Thanks

web-padawan commented 4 years ago

See also https://github.com/vaadin/vaadin-list-box/issues/11#issuecomment-545316100

quartelh commented 4 years ago

A number of other Vaadin components support label out-of the box, so without the need to wrap it in a CustomField. I think having a label with / as part of a input control is a very normal and helpful approach.

So why deviate by not supporting label ootb?

istibekesi commented 3 years ago

Workaround:

import com.vaadin.flow.component.customfield.CustomField;
import com.vaadin.flow.component.listbox.MultiSelectListBox;

import java.util.Set;

public class MultiSelectListBoxWithLabel<T> extends CustomField<Set<T>> {

    private MultiSelectListBox<T> multiSelectListBox = new MultiSelectListBox<>();

    public MultiSelectListBoxWithLabel(String label, T ...values) {
        super();
        this.multiSelectListBox.setItems(values);
        this.multiSelectListBox.addValueChangeListener(event -> updateValue());
        setLabel(label);
        add(multiSelectListBox);
    }

    @Override
    protected Set<T> generateModelValue() {
        return multiSelectListBox.getSelectedItems();
    }

    @Override
    protected void setPresentationValue(Set<T> newPresentationValue) {
        multiSelectListBox.setValue(newPresentationValue);
    }

    public MultiSelectListBox<T> getMultiSelectListBox() {
        return multiSelectListBox;
    }
}

Is this the correct way of wrapping into a CustomFiled?

istibekesi commented 3 years ago

Btw, I ended up using CheckboxGroup. I realized that CheckboxGroup is more rounded compared to ListBox and fits better in the Vaadin components palette, supporting labels, itemLabelGenerator... etc.

rolfsmeds commented 3 months ago

Helpers and validation (and probably some other APIs) should be considered as well, to make it a proper field component.