The <b:form> tag is an enhanced version of <h:form>.
The <b:form> tag inherits all the <h:form> attributes and behavior plus some Bootstrap specific attributes.
With Bootstrap you can have three kind of layouts for your forms:
<b:form/>
or a BootsFaces <b:form/> without attributes.<b:form inline="true"/>.<b:form horizontal="true"/> tag.
In order to align horizontal forms neatly, add the attributes label-col-xx="4" and col-xx="8.
(Of course, you can also use the symbolic names of BootsFaces, such as label-small-screen="one-third").
inline="true"
to the input field. This feature is deprecated (because it generats wrong HTML code). Adding insult to injury, it's
broken since BootsFaces 1.0. You can see such a broken example at the bottom of this page. Please migrate to the
new horizontal or inline forms.If you want to put muliple JSF elements into the same line of a horizontal form, you need to add a
<b:formGroup />. Otherwise, BootsFaces generates a form-group div
for each component, thus ruining the layout.
If you're using MyFaces, please updated to BootsFaces 1.4.1. The older versions of BootsFaces didn't render the
CSS code properly if run on MyFaces. Nor did they render any attribute you'd set, such as style.
This demo shows that <b:form /> behaves exactly like the standard <h:form />.
If the texts are printed white on a black background, <b:form /> is rendered correctly.
| Attribute | Default value | Description |
|---|---|---|
| accept | (none) | List of content types that a server processing this form will handle correctly |
| acceptcharset | (none) | List of character encodings for input data that are accepted by the server processing this form. |
| auto-update autoUpdate (alternative writing) |
false | Setting this flag updates the widget on every AJAX request. |
| binding | (none) | The ValueExpression linking this component to a property in a backing bean |
| dir | (none) | Direction indication for text that does not inherit directionality. Legal values: ltr (Default. Left-to-right text direction), rtl (Right-to-left text direction) and auto (let the browser figure out the direction of your alphabet, based on the page content). |
| enctype | (none) | Content type used to submit the form to the server. If not specified, the default value is 'application/x-www-form-urlencoded'. |
| horizontal | false | Use this flag to create a horizontal form (labels are on the same line as their input fields) |
| id | (none) | Unique identifier of the component in a namingContainer. |
| inline | false | Use this flag to create a inline form (labels are on the same line as their input fields) |
| lang | (none) | Code describing the language used in the generated markup for this component. |
| onclick | (none) | The onclick attribute. |
| ondblclick | (none) | Client side callback to execute when input element is double clicked. |
| onkeydown | (none) | Client side callback to execute when a key is pressed down over input element. |
| onkeypress | (none) | Client side callback to execute when a key is pressed and released over input element. |
| onkeyup | (none) | Client side callback to execute when a key is released over input element. |
| onmousedown | (none) | Client side callback to execute when a pointer input element is pressed down over input element. |
| onmousemove | (none) | Client side callback to execute when a pointer input element is moved within input element. |
| onmouseout | (none) | Client side callback to execute when a pointer input element is moved away from input element. |
| onmouseover | (none) | Client side callback to execute when a pointer input element is moved onto input element. |
| onmouseup | (none) | Client side callback to execute when a pointer input element is released over input element. |
| onreset | (none) | Javascript code executed when this form is reset. |
| onsubmit | (none) | Javascript code executed when this form is submitted. |
| prependId | false | Flag indicating whether or not this form should prepend its id to its descendent's id during the clientId generation process. If this flag is not set, the default value is true. |
| rendered | false | Boolean value to specify the rendering of the component, when set to false the component will not be rendered. |
| role | (none) | Role attribute used by screen readers. |
| style | (none) | Inline style of the input element. |
| style-class styleClass (alternative writing) |
(none) | Style class of this element. |
| target | (none) | Name of a frame where the response retrieved after this form submit is to be displayed. |
| title | (none) | Advisory title information about markup elements generated for this component. |