FormViewElement

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

Element and builder

The FormViewElement has an equivalent FormViewElementBuilder. A builder can be created using BootstrapViewElements.bootstrap.builders.form() factory methods.

FormViewElement attributes

Attribute Description Default

commandObject

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

Not set by default

errors

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

Not set by default

action

Url to use for the action attribute

Not set by default

multipart

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

formLayout

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

By default uses the DEFAULT formLayout

ViewElementPostProcessor

Add a ViewElementPostProcessor to customise the formElement

Not set by default

customTemplate

Provide a customTemplate to render the form

Not set by default

Examples

Simple form with no elements

import static com.foreach.across.modules.bootstrapui.ui.factories.BootstrapViewElements.bootstrap;

bootstrap.builders
    .form()
    .formName( "contact" )
    .noValidate()
    .htmlId( "contact" )
    .build();

Full form example

import static com.foreach.across.modules.bootstrapui.styles.BootstrapStyles.css;
import static com.foreach.across.modules.bootstrapui.ui.factories.BootstrapViewElements.bootstrap;

bootstrap.builders.form()
     .commandObject( data )
     .add(
             bootstrap.builders
                     .formGroup()
                     .label( "My number" )
                     .tooltip( bootstrap.builders.tooltip().text( "another tooltip" ) )
                     .required()
                     .detectFieldErrors( true )
                     .control(
                             bootstrap.builders.textbox()
                                               .controlName( "number" )
                                               .text( "" + data.getNumber() )
                     )
     )
     .add(
             bootstrap.builders
                     .formGroup()
                     .tooltip( bootstrap.builders
                                       .tooltip()
                                       .text( "hello" ) )
                     .control( bootstrap.builders
                                       .checkbox()
                                       .controlName( "checkme" )
                                       .label( "Check me out" )
                     )
     )
     .add(
             bootstrap.builders.formGroup()
                               .label( "My text" )
                               .descriptionBlock( "My text is a very important field containing... your text!" )
                               .helpBlock( "Please fill in all the data" )
                               .control( bootstrap.builders.textbox().controlName( "mytext" ) )
     )
     .add(
             bootstrap.builders.formGroup()
                               .control( bootstrap.builders.checkbox().controlName( "checkmetoo" ).label( "Try me babe" ) )
                               .helpBlock( "Try clicking *on* the checkbox in front of you." )
     )
     .add( bootstrap.builders.row().add( bootstrap.builders.column( Grid.Device.MD.width( 12 ) )
                                                           .add( bootstrap.builders.button( css.button.primary ).submit()
                                                                                   .text( "Update" ) ) ) );
« Breadcrumbs Forms Form controls »