A FormViewElement writes a <form> element to the output.

Element and builder

The FormViewElement has an equivalent FormViewElementBuilder. A builder can be created using factory methods.

FormViewElement attributes

Attribute Description Default


Set the command object that should be bound to this form.

Not set by default


Set the Errors that should be used for field error binding by the FormGroupElement members of this form.

Not set by default


Url to use for the action attribute

Not set by default


Create a multipart form by setting the correct encType. The FormViewElement support the following encTypes: ENCTYPE_PLAIN, ENCTYPE_MULTIPART, ENCTYPE_URLENCODED

Not set by default


Set the formLayout to be used: DEFAULT, INLINE or HORIZONTAL

By default uses the DEFAULT formLayout


Add a ViewElementPostProcessor to customise the formElement

Not set by default


Provide a customTemplate to render the form

Not set by default


Simple form with no elements

import static com.foreach.across.modules.bootstrapui.ui.factories.BootstrapViewElements.bootstrap;
    .formName( "contact" )
    .htmlId( "contact" )

Full form example

import static com.foreach.across.modules.bootstrapui.styles.BootstrapStyles.css;
import static com.foreach.across.modules.bootstrapui.ui.factories.BootstrapViewElements.bootstrap;
     .commandObject( data )
                     .label( "My number" )
                     .tooltip( "another tooltip" ) )
                     .detectFieldErrors( true )
                                               .controlName( "number" )
                                               .text( "" + data.getNumber() )
                                       .text( "hello" ) )
                                       .controlName( "checkme" )
                                       .label( "Check me out" )
                               .label( "My text" )
                               .descriptionBlock( "My text is a very important field containing... your text!" )
                               .helpBlock( "Please fill in all the data" )
                               .control( "mytext" ) )
                               .control( "checkmetoo" ).label( "Try me babe" ) )
                               .helpBlock( "Try clicking *on* the checkbox in front of you." )
     .add( Grid.Device.MD.width( 12 ) )
                                                           .add( css.button.primary ).submit()
                                                                                   .text( "Update" ) ) ) );