Text Field
The Text Field is one of the most commonly used fields. It saves a string to the database and provides the Admin Panel with a simple text input.
Admin Panel screenshot of a Text field and read-only Text field
To add a Text Field, set the type to text in your Field Config:
1
import type { Field } from 'payload'
2
3
export const MyTextField: Field = {
4
// ...
5
type: 'text',
6
}
Config Options
| Option | Description |
|---|---|
name * | To be used as the property name when stored and retrieved from the database. More |
label | Text used as a field label in the Admin Panel or an object with keys for each language. |
unique | Enforce that each entry in the Collection has a unique value for this field. |
minLength | Used by the default validation function to ensure values are of a minimum character length. |
maxLength | Used by the default validation function to ensure values are of a maximum character length. |
validate | Provide a custom validation function that will be executed on both the Admin Panel and the backend. More |
index | Build an index for this field to produce faster queries. Set this field to true if your users will perform queries on this field's data often. |
saveToJWT | If this field is top-level and nested in a config supporting Authentication, include its data in the user JWT. |
hooks | Provide Field Hooks to control logic for this field. More details. |
access | Provide Field Access Control to denote what users can see and do with this field's data. More details. |
hidden | Restrict this field's visibility from all APIs entirely. Will still be saved to the database, but will not appear in any API or the Admin Panel. |
defaultValue | Provide data to be used for this field's default value. More |
localized | Enable localization for this field. Requires localization to be enabled in the Base config. |
required | Require this field to have a value. |
admin | Admin-specific configuration. More details. |
custom | Extension point for adding custom data (e.g. for plugins) |
hasMany | Makes this field an ordered array of text instead of just a single text. |
minRows | Minimum number of texts in the array, if hasMany is set to true. |
maxRows | Maximum number of texts in the array, if hasMany is set to true. |
typescriptSchema | Override field type generation with providing a JSON schema |
virtual | Provide true to disable field in the database. See Virtual Fields |
* An asterisk denotes that a property is required.
Admin Options
The customize the appearance and behavior of the Text Field in the Admin Panel, you can use the admin option:
1
import type { Field } from 'payload'
2
3
export const MyTextField: Field = {
4
// ...
5
admin: {
6
// ...
7
},
8
}
The Text Field inherits all of the default options from the base Field Admin Config, plus the following additional options:
| Option | Description |
|---|---|
placeholder | Set this property to define a placeholder string in the text input. |
autoComplete | Set this property to a string that will be used for browser autocomplete. |
rtl | Override the default text direction of the Admin Panel for this field. Set to true to force right-to-left text direction. |
Example
collections/ExampleCollection.ts
1
import type { CollectionConfig } from 'payload'
2
3
export const ExampleCollection: CollectionConfig = {
4
slug: 'example-collection',
5
fields: [
6
{
7
name: 'pageTitle', // required
8
type: 'text', // required
9
required: true,
10
},
11
],
12
}
Next