Get started
Loading...
Important Notice - Forums is archived

To simplify things and help our users to be more productive, we have archived the current forum and focus our efforts on helping developers on Stack Overflow. You can post new questions on Stack Overflow or join our Discord channel.

Product icon
TUTORIAL

Vaadin lets you build secure, UX-first PWAs entirely in Java.
Free ebook & tutorial.

Where to include a web components css file when integrating a third party w by Martin Vyšný, 1 week ago
Recent Posts
Vaadin Forum3. Vaadin 6, 7, 8Framework UI

How to add non-field components to a form

Aniceto Madrid
1 decade ago Mar 16, 2010 10:36am

Hi

Sometimes it's required to put in a form some components that are not fields.

For instance, I need to show a field which is html, not for edit, only to show. RichTextArea is not a choice. I cannot add a Label with HTML content because it's not a field.

How to do it?

+1
Marko Grönroos
1 decade ago Mar 16, 2010 11:36am

You can put such extra components directly in the layout of the form. You can get the layout, which is a FormLayout by default, with getLayout().

For example:

myform.getLayout().addComponent(new Label("This is a Label"));

Binding such components to the data source of the form would need to be done manually. I'm not sure how easy that would be, there could be some issues.

+1
Marko Grönroos
1 decade ago Mar 16, 2010 11:51am

Ok, I tried it quick, binding an extra non-field component to the same data source works just fine, no problems. Just remember to have the source component immediate if the extra component is bound to its value.

See the form example. Select "Jupiter" and some moon, and the moon will be shown in the Label below.

// The form
    Form myform = new Form();
    myform.setCaption("My Little Form");
    myform.setFormFieldFactory(new MyFieldFactory());
    
    // Create a bean to use as a data source for the form
    MoonBean moonbean = new MoonBean();
    BeanItem<MoonBean> beanitem = new BeanItem<MoonBean>(moonbean);
    myform.setItemDataSource(beanitem);
    myform.setVisibleItemProperties(new Object[] {"planet", "moon"});

    // Put a non-Field component to the form and bind it to
    // the selection result
    Label label = new Label(); // No caption as bound to data source
    myform.getLayout().addComponent(label);
    label.setPropertyDataSource(beanitem.getItemProperty("moon"));
Aniceto Madrid
1 decade ago Mar 17, 2010 1:09pm

Marko

It works fine.

Thanks
Aniceto

Last updated on Mar, 17th 2010
Henri Sara
1 decade ago Mar 19, 2010 8:18am

Aniceto P Madrid:
For instance, I need to show a field which is html, not for edit, only to show. RichTextArea is not a choice. I cannot add a Label with HTML content because it's not a field.

If the field contents you want to show comes from your item, another option would be to use the CustomField component containing a Label.

Unfortunately, it is severely lacking examples of use and could use some other improvements as well when I have time to get back to it.