Tobago Demo

Menu

Root Dummy Intro Search Getting Started Docker What's New Migration Compatibility FAQ API Download Server Info Logging Info In Suggest Textarea Date Range Group 5 Star Rating File Upload Out Label Badge Image Figure Progress Object Checkbox Toggle Dropdown Radio Listbox SelectOneList Multi Checkbox Multi Listbox Shuttle SelectManyList Button and Link Default Command Button Group Customizer Link Group Box Panel Separator Section Header and Footer Bar Popup Popover Toast Basic example Tab Client Tab Ajax Tab Server Basic example Sheet Sorting Paginator Sheet Column Selector Sheet Selectionchange Sheet Event Sheet Action Sheet Markup Sheet Style Empty Sheet Column Bar Sheet Filter Sheet Static Header Sheet Multi Header Sheet Tree Column Panel Sheet Editable Sheet Lazy Sheet Nested Basic example Tree Command Types Tree Select Tree Editor Tree Menu Tree Listbox Intro TinyMCE CKEditor Flow Layout Flex Layout Segment Layout Label Layout Grid Layout Split Layout Message-layout Overview Collapsible Box Collapsible Popup Collapsible Panel Collapsible Section Content Validation JSR 303 Severity Messages Content Security Policy Sanitize Roles Form AccessKey Focus Exception Handler Style Tag Bootstrap Theme Icons Partial Ajax Behavior WebSocket Transition Non Faces Request Conversion Error Handling For Each ConversationScoped Download Configuration Format Locale DataAttribute Meta
Root Dummy Intro Search Getting Started Docker What's New Migration Compatibility FAQ API Download Server Info Logging Info In Suggest Textarea Date Range Group 5 Star Rating File Upload Out Label Badge Image Figure Progress Object Checkbox Toggle Dropdown Radio Listbox SelectOneList Multi Checkbox Multi Listbox Shuttle SelectManyList Button and Link Default Command Button Group Customizer Link Group Box Panel Separator Section Header and Footer Bar Popup Popover Toast Basic example Tab Client Tab Ajax Tab Server Basic example Sheet Sorting Paginator Sheet Column Selector Sheet Selectionchange Sheet Event Sheet Action Sheet Markup Sheet Style Empty Sheet Column Bar Sheet Filter Sheet Static Header Sheet Multi Header Sheet Tree Column Panel Sheet Editable Sheet Lazy Sheet Nested Basic example Tree Command Types Tree Select Tree Editor Tree Menu Tree Listbox Intro TinyMCE CKEditor Flow Layout Flex Layout Segment Layout Label Layout Grid Layout Split Layout Message-layout Overview Collapsible Box Collapsible Popup Collapsible Panel Collapsible Section Content Validation JSR 303 Severity Messages Content Security Policy Sanitize Roles Form AccessKey Focus Exception Handler Style Tag Bootstrap Theme Icons Partial Ajax Behavior WebSocket Transition Non Faces Request Conversion Error Handling For Each ConversationScoped Download Configuration Format Locale DataAttribute Meta

Content Validation

There are several ways to validate the content of a component. In general input components have the option for validation. In the following sections, the different kinds von validation are explained.

Tag Library Documentation: <tc:sheet/> | <tc:column/>

Required

A simple way of validation is the required attribute in some input components. The text area must not empty if the submit button is pressed. Otherwise, an error message is displayed.

<tc:textarea label="Text Area" required="true"/>

Validate Length

The length of a value can be validated by the <f:validateLength/> tag. Length means the number of characters. In this example, the given string must have at least two characters and maximal four characters.

Please note, an empty string will not be validated.

<tc:in label="Input"> <f:validateLength minimum="2" maximum="4"/> </tc:in>

Validate Long Range

The range of an integer number can be validated via <f:validateLongRange/>. In the following input field numbers from 3 to 77,777 can be added.

<tc:in label="Number" markup="number"> <f:validateLongRange minimum="3" maximum="77777"/> </tc:in>

Validate Double Range

The range of a floating point number can be validated via <f:validateDoubleRange/>. In the following input field numbers from 0.01 to 999.99 can be added.

<tc:in label="Number" markup="number"> <f:validateLongRange minimum="0.01" maximum="999.99"/> </tc:in>

Regex Validation

A value can be validated against a regex patter via the <f:validateRegex/> tag.

<tc:in label="Letter & Number" > <f:validateRegex pattern="[A-Za-z][0-9]"/> </tc:in>

The value in the field must be a word character combined with a number. For example 'T3'.

Custom Validator

It's also possible to add custom validators using the validator attribute of an input component. In this case, only the string 'Tobago' (uppercase/lowercase ignored) is accepted.

Two Field Validation

A validator check the password against the confirmation field. To get access to the confirmation field from the validator a binding with the binding attribute and the <f:attribute/> tag is created.

<tc:in label="Password" validator="#{validationController.passwordValidator}"> <f:attribute name="confirmationField" value="#{confirmBinding}"/> </tc:in> <tc:in label="Confirmation" binding="#{confirmBinding}"/>
© 2005-2025 Apache Software Foundation, Licensed under the Apache License, Version 2.0.