The `<tc:in/>` tag create a classic input field.

In most cases, a label should be placed in front of every input field. Use the attribute `label`.

<tc:in label="Input" value="Some Text"/>

The following input field should be selected after reloading the page. Use the `focus` attribute.

<tc:in label="Input (focus)" focus="true" value="Some Text"/>

An input field can be set as required with the `required` attribute. Such an input field must contain a value, otherwise a submit is not possible. Leave the field blank and press 'submit' to see the error message.

<tc:in label="Input (required)" required="true"/>

A help text can be added with the `help` attribute.

<tc:in help="\#{inController.helpText}"/>

To create an input field for passwords, set the `password` attribute to 'true'. It will hide the text as shown in the following example.

<tc:in label="Password" password="true" value="password"/>

A `placeholder` attribute can be used for explaining a user the meaning of a field.

The text of the placeholder is only shown if the value is an empty string.

<tc:in label="Placeholder" placeholder="Grey Text"/>

The `autocomplete` attribute can be used for explaining a user the meaning of a field.

The values are documented in .

The output field in this example, displays the given value on the server. With `<f:ajax render="outputAjax" listener="\#{inController.update}"/>`, the output field will be rerendered, after the value has been changed. This is because `outputAjax` is the id of the `<tc:out/>` tag. and the default event for `<tc:in/>` is `change`. Additional, the `listener` attribute is set. The given method is called after the input field loose focus.

AJAX on change