> ## Documentation Index
> Fetch the complete documentation index at: https://developer.dromo.io/llms.txt
> Use this file to discover all available pages before exploring further.

# Fields

> To implement Dromo in your application, you must first define a schema. A schema is an array of field objects. These fields will be matched to columns during the import process, and define the properties of the JSON payload passed back in the results.

## Basics[​](#basics "Direct link to Basics")

The most basic field consists of only a `key` and `label`. The field's key is its unique identifier, and will be the key of that field in the result JSON object. The field's label is how it will be displayed to the user.

* Schema
* Review screen
* Results

A basic schema could look like this:

<CodeGroup>
  ```javascript theme={null}
  fields: [
    {
      label: "First name",
      key: "firstName"
    },
    {
      label: "Last name",
      key: "lastName"
    },
    {
      label: "Membership ID",
      key: "memberId"
    }
  ]
  ```
</CodeGroup>

The user would then match these fields to the columns in their imported file, resulting in a review screen which looks like this:

<img src="https://mintlify.s3.us-west-1.amazonaws.com/dromo-88ab5238/reference/fields//images/assets/images/basicFields_review.png" alt="The review screen with data" />

And, when submitted, Dromo would provide you with a result data array like this:

<CodeGroup>
  ```json theme={null}
  [
    {
      "firstName": "Richard",
      "lastName": "Wysocki",
      "memberId": "38008"
    },
    {
      "firstName": "Paige",
      "lastName": "Pierce",
      "memberId": "29190"
    },
    {
      "firstName": "Paul",
      "lastName": "McBeth",
      "memberId": "27523"
    },
    {
      "firstName": "Kristin",
      "lastName": "Tattar",
      "memberId": "73986"
    },
    {
      "firstName": "Calvin",
      "lastName": "Heimburg",
      "memberId": "45971"
    },
    {
      "firstName": "Catrina",
      "lastName": "Allen",
      "memberId": "44184"
    },
    {
      "firstName": "Eagle",
      "lastName": "McMahon",
      "memberId": "37817"
    }
  ]
  ```
</CodeGroup>

## Field object reference[​](#field-object-reference "Direct link to Field object reference")

<ResponseField name="label" type="string" required>
  The human-friendly name of the field, shown to the user in the Dromo Uploader interface
</ResponseField>

<ResponseField name="key" type="string" required>
  The field's unique identifier, used as the key in the JSON results
</ResponseField>

<ResponseField name="type" type="FieldType" default="string">
  The field's type.

  Can be supplied in two formats:

  * As a string corresponding to a valid field type. If the field type accepts options, defaults will be used.
  * For field types which accept options, as a two element array where the first element is the string corresponding to a valid field type, and the second element is an object with type options.

  For more details, see [field types](/reference/fields/field-types).
</ResponseField>

<ResponseField name="description" type="string">
  An optional description of this field for the user. If you specify a value for this field, Dromo will show a ? icon in the importer that users can hover over to see this message.
</ResponseField>

<ResponseField name="alternateMatches" type="string[]">
  An array of alternate matches that this field to map to. See [column matching](#column-matching).
</ResponseField>

<ResponseField name="validators" type="Validator[]">
  An array of validator objects to validate this field. See [validators](#validators).
</ResponseField>

<ResponseField name="selectOptions" type="{ label: string, value: string, alternateMatches?: string[] }[]">
  For select fields only, an array of possible picklist values. See the [select field type](#select).
</ResponseField>

<ResponseField name="readOnly" type="boolean" default="false">
  If `true`, the user will not be able to edit the data in this field.

  This is useful if you want to exclusively populate a virtual field using hooks.
</ResponseField>

<ResponseField name="hidden" type="boolean" default="false">
  If `true`, the field will be hidden from the user at all times. A hidden field can be set only using hooks.

  A user will not be able to match a column of data to the field. A user will not see the field in the review screen. The field will only be added to the submitted final result.

  Since a user cannot change the value of a hidden field, no validations can be set on a hidden field.
</ResponseField>

<ResponseField name="requireMapping" type="boolean" default="false">
  If `true`, the field must be mapped when matching columns. The user will not be able to progress to the data review screen unless this field has been matched to a column in the input file.

  Note: cells in this column aren't required to have any values, that can be validated using [the validator `required`](/fields#required).
</ResponseField>

<ResponseField name="manyToOne" type="boolean" default="false">
  If `true`, the field may have multiple data columns mapped to it.

  The result payload will have an array of all mapped columns' values instead of just a single value. Row hooks will have an entry in a `manyToOne` array for each mapped column.
</ResponseField>

## Column matching[​](#column-matching "Direct link to Column matching")

During the column matching step, Dromo will try to match columns headers in the user data to a corresponding `label` or `key` within your fields.

If you want to provide additional aliases that should automatically match to a given field, you can do so by setting `alternateMatches` for that field.

Column matching is case-sensitive.

Example:

<CodeGroup>
  ```javascript theme={null}
  {
    label: "City",
    key: "city",
    alternateMatches: ["municipality", "town", "locality"]
  }
  ```
</CodeGroup>