---
title: "Attachment Picker"
description: "Effortlessly manage attachments with our versatile attachment-picker modal for uploads. (Gitana 4.0)"
product: "Gitana"
version: "4.0"
url: "/documentation/gitana/4.0/forms/cms/fields/attachment-picker"
---

# Attachment Picker

ID: `attachment-picker`

The `attachment-picker` field type renders a modal picker for an attachment.

Definition configuration:

```
{
    "type": "object",
    "_attachment": {
        "id": "default"
    }
}
```

Form configuration:

```
{
    "type": "attachment-picker"
}
```

## Options

The following options may be specified for the control:

| Option | Type | Default | Description |
| --- | --- | --- | --- |
| picker.fileTypes | array |  | Array of allowable file extensions for upload (ex. \`\['png', 'jpg', pdf'\]\`) |
| picker.maxFileSize | integer |  | Maximum allowed file size in bytes |

## Create a Document with an Attachment

Define a content model definition with some attachment-picker fields:

![sample.png](/documentation/gitana/4.0/forms/cms/fields/attachment-picker/sample.png)

Preview content model:

![sample-preview.png](/documentation/gitana/4.0/forms/cms/fields/attachment-picker/sample-preview.png)

Create a content instance:

![create.png](/documentation/gitana/4.0/forms/cms/fields/attachment-picker/create.png)

The document will be created, with the 3 attachments. Note: if there is no attachment with an id of 'default' then there will not be a thumbnail displayed for the document.

![created.png](/documentation/gitana/4.0/forms/cms/fields/attachment-picker/created.png)

Now the document's json looks like this:

```
{
    "title": "Sample Doc",
    "attachment1": {
        "id": "default1",
        "name": "default1.jpeg",
        "size": 28573,
        "contentType": "image/jpeg",
        "md5": "e22795357da867a6ed134c99050c0fa"
    },
    "attachment2": {
        "id": "default2",
        "name": "default2.jpeg",
        "size": 20989,
        "contentType": "image/jpeg",
        "md5": "4e8e7438f33d8375b77c665d38b18b95"
    },
    "attachment3": {
        "id": "default3",
        "name": "default3.jpeg",
        "size": 89873,
        "contentType": "image/jpeg",
        "md5": "b3346ec8f92c65f28ff4a6e9a973dd3"
    }
}    
```

## Replace an Attachment

Click the pencil to go to **Edit** page and click **Upload...** button, choose a different file then save:

![replace.png](/documentation/gitana/4.0/forms/cms/fields/attachment-picker/replace.png)

## Delete an Attachment

Click the pencil to go to **Edit** page and click **Clear** button, then Save. The attachment is removed and the document icon. Note: if there is no attachment with an id of 'default' then there will not be a thumbnail displayed for the document.

## Content Modeling Example

Suppose you define a new content type (such as `custom:thing`) with the following schema:

```
{
    "title": "Thing",
    "type": "object",
    "properties": {
        "title": {
            "type": "string"
        },
        "file": {
            "type": "object",
            "_attachment": {
                "id": "file"
            }
        }
    }
}
```

You can then define the form to customize the attachment field.

```
{
    "fields": {
        "title": {
            "label": "Title"
        },
        "file": {
            "label": "File",
            "type": "attachment-picker",
            "picker": {
                "fileTypes": [
                    "jpeg",
                    "jpg"
                ]
            }
        }
    },
    "title": "Default Form"
}
```