FlowUI: Combining two components

Support
#1

I want to show two components in one column in the screen.

I have done as follows:

<hbox id="quoteAndVersion">
                <textField id="quoteNoField" property="quoteNo" readOnly="true" width="80%"/>
                <textField id="quoteVersionField" property="quoteVersion" readOnly="true" width="20%"/>
            </hbox>

and I get like this ,

image

But as you see the label is missing. So how can I get the label for each and how I can have one for both?

#3

Hi, @mortoza_khan
Thank you for your question.

There are many ways to attach a label to a components.
In your case, you can define the dataContainer as an attribute of the components.
Another way is to define the label explicitly, through the label attribute.

If you want to combine components so that they have the same properties, the best practice is to use your own field.
The Vaadin 23 documentation describes in detail the process of creating such components. Link

In this way, you can combine some of the properties of the components. (errorMessage, label etc.)

Regards,
Dmitriy